ASP.Netで自動完成JQuery

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

あなたは[Tab]キーを押すか、項目を選択することで項目を選択することができ、この

$(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 
}); 
}); 

を試してみてください。