【发布时间】：2012-08-22 22:45:03
【问题描述】：
我有一个连接到 jQuery UI 自动完成小部件的文本框。自动完成的来源是返回“Person”对象列表的 WebMethod。用户将开始输入人名，然后从自动完成列表中进行选择。然后，我希望其他几个文本框根据从自动完成列表中选择的项目填充值（公司、电话、电子邮件等）。这些其他值包含在返回的“Person”对象中。
我的 WebMethod 已成功填充对象列表，但在用户输入文本时未显示自动完成列表。我不确定如何判断对象列表是否真的被正确地传回给 jQuery 自动完成。
所以这是一个两部分的问题：
- 为什么没有填充自动完成列表？
- 我填充辅助文本框的代码是否正确？
请注意，我已经查看了所有其他“可能被视为重复”的问题，但没有一个解决了这种特殊情况。
我的 Person 类：
public class Person
{
//New properties -------------
public string label {get; set;}
public string value {get; set;}
// ----------------------------
public string Name {get; set;}
public string Company {get; set;}
public string Phone {get; set;}
public string Mobile {get; set;}
public string Email {get; set;}
public string Fax {get; set;}
}
HTML/Javascript：
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<link href="Scripts/themes/ui-lightness/jquery.ui.all.css" rel="stylesheet" type="text/css" />
<script src="js/jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.8.12.custom.min.js" type="text/javascript"></script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="True">
</asp:ScriptManager>
<div>
<asp:TextBox ID="txtName" runat="server"></asp:TextBox>
</div>
<div>
<asp:TextBox ID="txtCompany" runat="server" ></asp:TextBox>
<asp:TextBox ID="txtPhone" runat="server" ></asp:TextBox>
<asp:TextBox ID="txtMobile" runat="server" ></asp:TextBox>
<asp:TextBox ID="txtEmail" runat="server" ></asp:TextBox>
<asp:TextBox ID="txtFax" runat="server" ></asp:TextBox>
</div>
<script type="text/javascript">
PageMethods.SearchContacts(function (results) {
$("#txtName").autocomplete({
source: results,
select: function (event, ui) {
$('#txtCompany').val(ui.item.company);
$('#txtPhone').val(ui.item.phone);
$('#txtMobile').val(ui.item.mobile);
$('#txtEmail').val(ui.item.mobile);
$('#txtFax').val(ui.item.mobile);
}
});
});
</script>
</asp:Content>
WebMethod 返回 Person 对象列表：
[System.Web.Script.Services.ScriptMethod()]
[System.Web.Services.WebMethod]
public static List<Person> SearchContacts()
{
try
{
using (SqlConnection conn = new SqlConnection())
{
conn.ConnectionString = ConfigurationManager.ConnectionStrings["ConnStr"].ConnectionString;
using (SqlCommand cmd = new SqlCommand())
{
cmd.CommandText = "SELECT Name, Company, PhoneOffice, PhoneMobile, Email, Fax FROM Contacts";
cmd.Connection = conn;
conn.Open();
List<Person> contacts = new List<Person>();
using (SqlDataReader sdr = cmd.ExecuteReader())
{
while (sdr.Read())
{
Person person = new Person();
//New properties --------------------
person.label = sdr["Name"].ToString();
person.value = sdr["Name"].ToString();
// ----------------------------------
person.Name = sdr["Name"].ToString();
person.Company = sdr["Company"].ToString();
person.Phone = sdr["PhoneOffice"].ToString();
person.Mobile = sdr["PhoneMobile"].ToString();
person.Email = sdr["Email"].ToString();
person.Fax = sdr["Fax"].ToString();
contacts.Add(person);
}
}
conn.Close();
return contacts;
}
}
}
catch (Exception ex)
{
throw new Exception(ex.Message);
}
}
【问题讨论】：
-
自动完成小部件需要一个包含
label属性、value属性或两者的对象的数组。您的Person对象不符合该规则。 -
@AndrewWhitaker 感谢您提供的信息。在这种情况下，“标签”和“价值”的值是什么？人名？
-
是的，尝试添加这些属性，看看会发生什么
-
@AndrewWhitaker 不走运。尝试添加这些属性（参见我上面的编辑），但自动完成列表仍未显示。
-
嗯。加载页面时，生成的 JavaScript 是什么样的？
标签： c# jquery-ui jquery-ui-autocomplete webmethod