在asp.net中使用ajax调用更新下拉列表

Question

我有一个带有下拉列表"ListBox"的网页，其中包含用户的电子邮件地址。

当我在下拉列表中添加新的电子邮件用户时，我如何制作一个函数来更新下拉列表"ListBox"？

我尝试过这个解决方案，但没有成功，因为它清空了下拉列表，而不是添加新用户。

这是我的代码：

nnewuser.txuser = $("[id*=txuser]").val();
$.ajax({
type: "POST",
url: "prefix.aspx/Savepnusers" + qString,
data: '{nnewuser: ' + JSON.stringify(nnewuser) + '}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
if ($("[id*=txuser]").val()) {
alert("Ok");
alert(JSON.stringify(nnewuser));
$("[id*=ListBox1]").html(response);                            
}
},
failure: function (response) {
alert(response.d);
},
error: function (response) {
alert(response.d);
},
error: function (xhr, ajaxOptions, thrownError) {
alert("error : " + thrownError + JSON.stringify(nnewuser));
}
});
return false;
});

保存用户

public class pnnusers
{
public string txuser { get; set; }
}
[WebMethod(EnableSession = true)]
[ScriptMethod]
public static void Savepnusers(pnnusers nnewuser)
{
string sql = @String.Format(" INSERT INTO `tbl_email` (email) VALUES (?); ");
using (OdbcConnection cn =
new OdbcConnection(ConfigurationManager.ConnectionStrings["cn"].ConnectionString))
{
using (OdbcCommand command =
new OdbcCommand(sql, cn))
{
try
{
command.Connection.Open();
command.Parameters.AddWithValue("param1", nnewuser.txuser.ToString());
command.ExecuteNonQuery();
}
catch (Exception ex)
{
throw ex;
}
finally
{
command.Connection.Close();
}
}
}
}

下拉列表

private void MTListBox1()
{
DataTable dt = new DataTable();
sql = @String.Format(" SELECT ");
sql += String.Format(" LOWER(Email) AS UserEmail ");
sql += String.Format(" FROM ");
sql += String.Format("  tbl_email ORDER BY LOWER(Email) ASC; ");
using (OdbcConnection cn =
new OdbcConnection(ConfigurationManager.ConnectionStrings["cn"].ConnectionString))
{
using (OdbcCommand command =
new OdbcCommand(sql, cn))
{
try
{
command.Connection.Open();
OdbcDataAdapter sqlDa = new OdbcDataAdapter(command);
sqlDa.Fill(dt);
if (dt.Rows.Count > 0)
{
ListBox1.DataTextField = "UserEmail";
ListBox1.DataValueField = "UserEmail";
ListBox1.DataSource = dt;
ListBox1.DataBind();
}
}
catch (OdbcException ex)
{
string msg = "Fetch Error:";
msg += ex.Message;
throw new Exception(msg);
}
finally
{
command.Connection.Close();
}
}
}
}

Answer 1

这里有两个主要问题：

首先，Savepnusers方法不返回任何内容，因此不能在AJAX调用中使用response。您需要的是重新初始化ListBox1或在Savepnusers成功完成后附加新项目：

其次，您似乎无法正确发送nnewuser作为参数。您不需要pnnusers类，只需使用string类型作为参数即可。

所以服务器端：

public static void Savepnusers(string nnewuser)

在客户端，您需要使用jquery添加dropdownlist项：

var txtUser = $("[id*=txuser]").val();
$.ajax({
type: "POST",
url: "prefix.aspx/Savepnusers",
data: JSON.stringify({ nnewuser: txtUser }),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function () {
//Since you can't use response object, you can append new item  to dropdownlist
if (txtUser) {
$("[id*=ListBox1]").append('<option value="'+txtUser+'">'+txtUser+'</option>');         
}
},
failure: function (response) {
alert(response.d);
},
error: function (response) {
alert(response.d);
},
error: function (xhr, ajaxOptions, thrownError) {
alert("error : " + thrownError + JSON.stringify(nnewuser));
}
});

请参阅：asp dropdownlist动态值来自javascript问题