Question

您能否帮助我了解如何在自动填充下拉列表中获取所选项目的值？我能够填充数据，我想单独获取所选项目的值。以下是我正在使用的片段。

 $(document).ready(function () {
$("#txtTest").autocomplete({ 
     source: function (request, response) {  
         $.ajax({  
             type: "POST",  
             contentType: "application/json; charset=utf-8", 
             url: "Webservice.asmx/GetNames",
             data: "{'prefix':'" + request.term + "'}",  
             dataType: "json",  
             async: true,  
             success: function (data){  
                response($.map(data, function(item)
                { return item ; }));  
            },  
            error: function (result) {  
               alert("Due to unexpected errors we were unable to load data");  
            }  
         });
     },  
     minLength:2
 });
 });

由于

Answer 1

以下是此情况的示例。

Default.aspx的

<script type="text/javascript">
$(document).ready(function() {
    $("input#<%=txtKelime.ClientID %>").autocomplete('Ara.aspx').result(function(event, item) {
        $("#<%=txtGizliAlan.ClientID %>").val(item.toString().split(",")[1]);
    });
});
</script>

<form runat="server" id="form1">
    <asp:textbox id="txtKelime" runat="server" />
    <asp:textbox id="txtGizliAlan" runat="server" style="display:none" />
</form>

Search.aspx

protected void page_load(object sender, EventArgs e) {
string strKelime = Request.QueryString["q"];
DataTable dt = Database.GetDataTable("Select * from TableName where SearchString like '%" + SearchWord + "%'");
foreach (DataRow dr in dt.Rows)
{
Response.Write(dr["alanAdi"].ToString() + "|" + dr["id"].ToString() + Environment.NewLine);
}
}

你可以看到这个演示。 http://jquery.bassistance.de/autocomplete/demo/

Answer 2

试试这个

$(document).ready(function () {



$("#txtTest")
            // don't navigate away from the field on tab when selecting an item
            .live("keydown", function (event) {
                if (event.keyCode === $.ui.keyCode.TAB &&
                        $(this).data("autocomplete").menu.active) {
                    event.preventDefault();
                }
            })
.autocomplete({ 
     source: function (request, response) {  
         $.ajax({  
             type: "POST",  
             contentType: "application/json; charset=utf-8", 
             url: "Webservice.asmx/GetNames",
             data: "{'prefix':'" + request.term + "'}",  
             dataType: "json",  
             async: true,  
             success: function (data){  
                response($.map(data, function(item)
                { return item ; }));  
            },  
            error: function (result) {  
               alert("Due to unexpected errors we were unable to load data");  
            }  
         });
     },  
     minLength:2
 });
 });

您可以通过按Tab键或选择项目来选择项目。

使用ASP.Net自动完成JQuery

2 个答案: