jQueryのオートコンプリートラベル、選択時に異なるフィールドの値

Question

私はjQueryオートコンプリート（http://jqueryui.com/demos/autocomplete/）を使用していますが、それは機能していますが、ユーザーがアイテムを選択すると、テキストボックスユーザーが項目を選択すると、ラベルがテキストボックスのテキストとして使用され、その値が隠しフィールド 'cId'に挿入されるようにしたいと思います。

私は周りを見て、解決策を見つけるように見えるかもしれません。

マイ値は以下のようにClientCsvと呼ばれる文字列である：

[ { label: "ClientId1", value: "ClientName1" }, { label: "ClientId2", value: "ClientName2" } ] 

私が現在使用してjQueryのは、次のとおりです。

$(function() { 
var availableTags = [ " & ClientCsv() & " ]; $('#tags').autocomplete({ source: availableTags}); 
}); 

フォームコード：任意の助け

<asp:TextBox ID="tags" runat="server"></asp:TextBox> 
<asp:HiddenField ID="cId" runat="server" /> 

感謝。

Answer 1

オートコンプリートのためにselectイベントを配線し、検索フィールドに値を入力するデフォルト動作を禁止する必要があります。

var availableTags = [{ label: "ClientId1", value: "ClientName1" }, { label: "ClientId2", value: "ClientName2"}]; 

$(function() { 
    var txt = $('#tags'); 
    txt.autocomplete({ 
     source: availableTags, 
     select: function(event, ui){ 
      //put the label in your text field 
      txt.val(ui.item.label); 

      //put the value in your hidden field 
      $('#cId').val(ui.item.value); 

      //cancel the event to prevent it populating the value 
      event.preventDefault(); 
     } 
    }); 
});