jQueryオートコンプリートカテゴリラベルと値を選択

Question

カテゴリを含むjQueryオートコンプリートを取得しようとすると、選択した値を検索フィールドに、値を別の入力フィールドに返します。

私は値とラベルとカテゴリを持つようにデータを変更しました。

は

http://jsfiddle.net/chrisk/bM7ck/を参照してくださいしかし、値は常に代わりにラベルの検索フィールドに返されます。

Answer 1

これは、ラベルと値の両方を入力するとjquery UIオートコンプリートがどのように機能するかを示しています。ラベルを検索フィールドに戻す場合は、値フィールドの名前を変更します。

更新フィドル：http://jsfiddle.net/jensbits/bM7ck/3/

Answer 2

あなたは、あなただけに近い必要だ

：

1. あなたselectイベントハンドラの最後にreturn falseを追加し、
2. focusのイベントハンドラを追加します。その値の代わりにラベルを使用して、上書きすることもできます。

はここにあなたのコードが更新されます：

$("#search").catcomplete({ 
    delay: 0, 
    source: data, 
    select: function(event, ui) { 
     $('#search').val(ui.item.label); 
     $('#searchval').val(ui.item.value); 
     return false; // Prevent the widget from inserting the value. 
    }, 
    focus: function(event, ui) { 
     $("#search").val(ui.item.label); 
     return false; // Prevent the widget from inserting the value. 
    } 
}); 

ここで更新例です：http://jsfiddle.net/q2kDU/

Answer 3

$(function() { 
     $("#searchitems").autocomplete({ 
      source: [<?php echo $search /*example for full list in php*/?>], 
      minLength: 2, 
      select: function(event, ui) { 
       event.preventDefault(); 
       $("#searchitems").val(ui.item.label); 
       $('#searchitemvalue').val(ui.item.value); 
       window.location="#"; //location to go when you select an item 
      }, 
      focus: function(event, ui) { 
       event.preventDefault(); 
       $("#searchitems").val(ui.item.label); 
       $('#searchitemsvalue').val(ui.item.value); 
      } 
     }); 
    });