2016-12-26 16 views
0

私は先にTwitterタイプを使用していますが、結果をmysqlクエリから分けることは困難です。先行入力Bloodhoundソートの戻り値。

マイJSON出力は次のようになります。{「ID」:「1」、「名前」:「ブラボー」}

現在の状態で先行入力の結果は名前とIDを示している、私は希望名前だけを表示できるようにしたいが、入力の実際のサブミット値はIDになる。私のスクリプトは流行しています:

私はこれを達成する方法は非常に歓迎します。

ありがとうございました!

答えて

1

現在の取得値を格納するオブジェクトを作成できます。 filterオプションがBloodhoundの場合、オブジェクトプロパティをname.nameに設定し、値をname.idに設定します。

JSONnameプロパティのみを返して表示するには、indexパラメータを$.map()とし、オブジェクトのプロパティ名を確認します。プロパティが"name"の返品{value:name}の場合は、nullを返します。

使用typeahead:selectedfilterの初期の戻り値の以前に格納されたオブジェクトにプロパティ参照として.typeaheadinputの現在の値を使用して<form><input type="hidden">要素の値を設定するイベント。値を空のオブジェクトに格納する変数参照を設定します。

<form> 
    <input class="typeahead" type="text" placeholder="search"> 
    <input type="hidden" name="result" value="" /> 
    <input type="submit"> 
</form> 

$(function() { 
    // Instantiate the Bloodhound suggestion engine 
    var curr = {}; 
    var suggestions = new Bloodhound({ 
    datumTokenizer: function(datum) { 
     return Bloodhound.tokenizers.whitespace(datum.value); 
    }, 
    queryTokenizer: Bloodhound.tokenizers.whitespace, 
    remote: { 
     url: 'includes/livesearch.php?key=%QUERY',  
     wildcard: '%QUERY', 
     filter: function (name) { 
      curr[name.name] = name.id; 
      // Map the remote source JSON array to a JavaScript object array 
      return $.map(name, function (name, index) { 
       return index === "name" ? { 
        value: name 
       } : null; 
      }); 
     } 
    } 

    }); 
    // Initialize the Bloodhound suggestion engine 
    suggestions.initialize(); 

    // Instantiate the Typeahead UI 
    $(".typeahead").typeahead({ 
    hint: true, 
    minLength: 2 
    }, { 
    limit: 7, 
    displayKey: 'value', 
    source: suggestions.ttAdapter(), 
    }) 
    .on("typeahead:selected", function (e, datum) { 
    $("form [name=result]").val(curr[datum.value]); // set value here 
    curr = {}; 
    }); 
}) 

plnkr私がまさに必要な方法http://plnkr.co/edit/PJjzxemAQ9fO3P5YBfXi?p=preview

+0

作品!どうもありがとうございました ! –

関連する問題