我想在多个文本框中激活jQuery AutoComplete
txtcity
和txtcity2
具有相同的功能,而没有添加用于第二个控件的第二个控件,下面是提供更多详细信息的代码。
<asp:TextBox ID="txtcity" runat="server" class="form-control textupper" ></asp:TextBox>
<asp:TextBox ID="txtcity2" runat="server" class="form-control textupper" ></asp:TextBox>
这是我的代码:
jQuery代码:
<script type="text/javascript">
//On Page Load.
$(function () {
SetAutoComplete();
});
//On UpdatePanel Refresh.
var prm = Sys.WebForms.PageRequestManager.getInstance();
if (prm != null) {
prm.add_endRequest(function (sender, e) {
if (sender._postBackSettings.panelsToUpdate != null) {
SetAutoComplete();
}
});
};
function SetAutoComplete() {
$("[id$=txtcity]").autocomplete({
source: function (request, response) {
$.ajax({
url: 'frm_cr_t.aspx/GetCities',
data: "{ 'prefix': '" + request.term + "'}",
dataType: "json",
type: "POST",
contentType: "application/json; charset=utf-8",
success: function (data) {
response($.map(data.d, function (item) {
return {
label: item.split('-')[0],
val: item.split('-')[1]
};
}))
}
});
}
});
}
</script>
后面的代码:
<WebMethod()>
Public Shared Function GetCities(prefix As String) As String()
Dim cities As New List(Of String)()
Using conn As New NpgsqlConnection()
conn.ConnectionString = ConfigurationManager.ConnectionStrings("connauthentpg").ConnectionString
Using cmd As New NpgsqlCommand()
cmd.CommandText = "select distinct upper(lbl_ct) as lbl_ct from tbl_cit where upper(lbl_ct) like upper(:lbl_ct) order by lbl_ct "
cmd.Parameters.Add("lbl_ct", NpgsqlDbType.Varchar)
cmd.Parameters("lbl_ct").Value = "%" & prefix & "%"
cmd.Connection = conn
conn.Open()
Using sdr As NpgsqlDataReader = cmd.ExecuteReader()
While sdr.Read()
cities.Add(String.Format("{0}", sdr("lbl_ct")))
End While
End Using
conn.Close()
End Using
End Using
Return cities.ToArray()
End Function
任何帮助都非常感谢您
答案 0 :(得分:0)
我以前要做的是在两个输入中都添加一个类,然后使用它来运行
$(".theAutoCompleteClass").autocomplete
<asp:TextBox ID="txtcity" runat="server" class="form-control textupper theAutoCompleteClass" ></asp:TextBox>
<asp:TextBox ID="txtcity2" runat="server" class="form-control textupper theAutoCompleteClass" ></asp:TextBox>