2017-04-04 74 views
0

網頁開發新手。我正在研究一個ASP MVC應用程序。目前,我正在製作一個表單,我需要一個可供搜索的下拉框。在哪裏我可以點擊下拉菜單並查看所有選項並進行搜索。Bootstrap Searchable Drop down

這個數據將是一個Ajax請求,有JSON對象的列表,性能標識名稱。 「Id」將是選項值,「名稱」將是選項名稱。

我查看了其餘的問題,主要是解決方案是圍繞Angular和ASP Web Forms。

我不使用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> 

感謝。

+0

請出示相關的代碼,並試圖解決這個問題 – indubitablee

+0

做將有助於現有的代碼問題。你沒有顯示你的問題,所以我們無法幫助解決它們。 – Derek

+0

我之前使用過這個,http://nicolasbize.com/magicsuggest/index.html不幸的是,ajax飼料似乎停運了,但它確實有效。我想這可能是你要找的。 –

回答