[英]Auto complete in asp.net using jquery
在這里我試圖在asp.net中使用jquery auto complete，我正在嘗試從sql數據源中檢索數據並將其用於自動提取。 而我運行代碼自動完成沒有工作。
我的代碼
<script src="jquery.min.js" type="text/javascript"></script>
<script src="jquery-ui.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
SearchText();
});
function SearchText() {
$(".autosuggest").autocomplete({
source: function (request, response) {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Inventory.aspx/GetAutoCompleteData",
data: "{'username':'" + document.getElementById('txtPartno').value + "'}",
dataType: "json",
success: function (data) {
response(data.d);
},
error: function (result) {
alert("Error");
}
});
}
});
}
</script>
文本框字段
<asp:TextBox ID="txtPartno" CssClass="Textboxbase" class="autosuggest" runat="server"></asp:TextBox>
和我的c＃代碼
protected void Page_Load(object sender, EventArgs e)
{
}
[WebMethod]
public static List<string> GetAutoCompleteData(string username)
{
List<string> result = new List<string>();
using (SqlConnection con = new SqlConnection("Data Source=MYPC-GN\\KASPLDB;Integrated Security=False;User ID=sa;Password=*****;Connect Timeout=15;Encrypt=False;TrustServerCertificate=False"))
{
using (SqlCommand cmd = new SqlCommand("select DISTINCT PART_NO from Inventory where UserName LIKE '%'+@SearchText+'%'", con))
{
con.Open();
cmd.Parameters.AddWithValue("@SearchText", username);
SqlDataReader dr = cmd.ExecuteReader();
while (dr.Read())
{
result.Add(dr["UserName"].ToString());
}
return result;
}
}
}
我能看到的一個問題是你的javascript調用有點不對。 您無法使用document.getElementById('txtPartNo') asp本身創建的文本框的值。 要獲得此值，您必須獲取它的客戶端ID，您可以使用txtPartNo.ClientID以便最終這將成為 -
data: "{'username':'" + document.getElementById('<%= txtPartno.ClientID %>').value + "'}",
如果你不嘗試這種方式，那么你將無法獲得該文本框的實際值，並且undefined將被發送到C＃方法，該方法不會返回任何內容。
首先，您應該檢查它是否被調用的JavaScript函數。 如果它被調用，那么你應該檢查網址是否正確。 您可以檢查開發人員工具/ firebug等，以查看您發送的請求。
我做了如下：
ajaxCallSetting.js
var ajaxCallSetting = function (element, message, req) { var baseInfo = { baseUrl: "http://localhost:10266/" }; var buildUrl= function() { return baseInfo.baseUrl + message; }; var callApi = function(request, response) { $.ajax({ type: "POST", contentType: "application/json; charset=utf-8", url: buildUrl(), data: JSON.stringify(req), dataType: "json" }).success(function(data) { response(data.d); }); }; return { init: function() { $(element).autocomplete({ source: callApi }); } }; };
頭標記：
<head> <title></title> <script src="https://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript"></script> <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js" type="text/javascript"></script> <script src="ajaxCallSetting.js"></script> <link href="https://code.jquery.com/ui/jquery-ui-git.css" rel="stylesheet" /> <script type="text/javascript"> $(document).ready(function () { var req = { username: $('#txtPartno').val() }; apiSettings('#txtPartno', "Default.aspx/GetAutoCompleteData", req).init(); }); </script> </head>
盡可能使用JavaScript中的代碼保持單獨的Html代碼是有用的。
我不認為你的TextBox正在被正確連接。 嘗試這個：
<asp:TextBox ID="txtPartno" CssClass="Textboxbase autosuggest" runat="server"></asp:TextBox>
並在您的JavaScript中嘗試這個：
$(".autosuggest").autocomplete({
source: function (request, response) {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Inventory.aspx/GetAutoCompleteData",
data: "{'username':'" + request.term + "'}",
dataType: "json",
success: function (data) {
response(data.d);
},
error: function (result) {
alert("Error");
}
});
}
});
jQuery自動完成文本框不適用於使用ASP.NET的更新面板
[英]jquery auto complete textbox is not working with update panel using ASP.NET
ASP.NET自動重新加載div而不使用javascript或jquery？
[英]ASP.NET auto reload div without using javascript or jquery?
用戶選擇一項后（使用Enter或單擊鼠標），在asp.net自動完成文本框中跳出選項卡
[英]Tab out of asp.net auto complete textbox after user selects an item (using enter or mouse click)
jQuery，Asp.net -jAutoCalc：使用jQuery在要添加到表格中的表單上實現自動計算
[英]jQuery, Asp.net -jAutoCalc : Implement auto calculation on the form to be appended in the table using jQuery
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.