キー値タブ付きの検索フィルタ

Question

私はAwsコンソールで見るような検索フィルタを構築する必要があります。

私はAwsコンソールで、ユーザーがテキストフィールドをクリックすると、選択のための列フィールドを示すドロップダウンリストが表示されます。検索のための値を与えると、以下のようにテキストフィールド内のタグとして追加されます。

誰でもこのコンポーネントの名前を教えてもらえますか？ jquery、角度などのオープンソースとして利用可能なものがありますか

私は基本的なオートコンプリート検索で多くのコンポーネントを作成しましたが、このようなものはありません。

私はブートストラップタグ入力（https://bootstrap-tagsinput.github.io/bootstrap-tagsinput/examples/）を持っていますが、問題は利用可能なタグのみを選択できることです。しかし、私の場合はテーブルに5つのカラム（名前、場所、連絡先、年齢、職業）。名前、場所、連絡先、年齢、職業のオートコンプリートをテキストフィールド上でクリックすると、名前が選択されたと言うことができます。次に名前を入力する必要があります。検索の名前と最後にa名前のように、個々のタグ：someValueの

は、誰もがこの

Answer 1

に私を助けてくださいすることができ、このため、多くのJSプラグインがあります：参照チェックのために

<input class="tagsinput-typeahead" type="text" /> 

var places = [ 
    {name: "New York"}, 
    {name: "Los Angeles"}, 
    {name: "Copenhagen"}, 
    {name: "Albertslund"}, 
    {name: "Skjern"} 
]; 
$('.tagsinput-typeahead').tagsinput({ 
    typeahead: { 
    source: places.map(function(item) { return item.name }), 
    afterSelect: function() { 
     this.$element[0].value = ''; 
    } 
    } 
}); 

この：は、ここ

も、ブートストラップのプラグインです： ​​