ブートストラップ検索可能なドロップダウン

Question

Web開発の新しい機能。私はASPのMVCアプリケーションに取り組んでいます。現在、ドロップダウンボックスが必要なフォームを検索しています。ドロップダウンをクリックしてすべての選択肢を表示し、検索することができます。このため

データは、プロパティ同上と名前で、JSONオブジェクトのリストを持っているAjaxリクエストになります。 "Id"がオプション値になり、 "名前"がオプション名になります。

私はこれに関する質問の残りの部分を調べましたが、ほとんどの解決策はAngularとASP Webフォームの周りでした。

私はAngularを使用していません。BootstarpとJqueryを使用して解決策を提案してください。任意の外部プラグインの提案？

<h1 class="col-sm-10 text-center">Data Import</h1> 
<hr class="col-sm-10"/> 
<form class="col-sm-10 form-horizontal"> 
    <div class="form-group"> 
     <label for="test" class="control-label col-sm-2">Name</label> 
     <div class="col-sm-10"> 
      <select class="col-sm-10 form-control" id="tenantList"> 
       <option value="1">Value</option> 
      </select> 
     </div> 
    </div> 
</form> 

<script> 
    $.ajax({ 
     url: 'api/Tenant' 
    }) 
    .done(function (data) { 
     $('#tenantList').html(""); 
     var list = ""; 
     $(data).each(function(idx, object) { 
      list += "<option value = " + object.id + ">"+object.name+"</option>"; 
     }); 
     $('#tenantList').html(list); 
    }) 
    .fail(function() { 
     console.log("Problem :(");   
    }); 
</script> 

ありがとう：

以下は、現在のコードです。

Answer 1

チェックアウトのjQuery UI」コンボボックス： https://jqueryui.com/autocomplete/#combobox