我有一個文本框連接到jQuery UI自動填充小部件。自動完成的源代碼是返回「Person」對象列表的WebMethod。用戶將開始輸入個人姓名,然後從自動完成列表中進行選擇。然後,我希望其他幾個文本框根據從自動完成列表中選擇的項目填充值(公司,電話,電子郵件等)。這些其他值包含在返回的「Person」對象中。不從WebMethod返回對象填充文本框自動完成
我的WebMethod正在成功填充對象列表,但當用戶輸入文本時不會顯示自動完成列表。我不知道如何判斷對象列表是否實際上正確傳遞迴jQuery Autocomplete。
所以這是一個2部分的問題:
- 爲什麼自動完成列表中沒有顯示?
- 是我的代碼來填充輔助文本框是否正確?
請注意,我已經看過所有其他'可能被認爲是重複'的問題,但他們都沒有解決這個特定的情況。
我的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>
Person對象的的WebMethod返回列表:
[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'屬性或兩者的對象的數組。您的「人物」對象不符合該規則。 –
@AndrewWhitaker感謝您的信息。在這種情況下,'label'和'value'的值是什麼?這些人的名字? – Dhaust
是的,嘗試添加這些屬性,看看會發生什麼 –