使用JavaScript/jQuery，如何根據從下拉列表中進行選擇來過濾列表？

Question

這裏是我的應用程序的截圖：

，你看到從數據庫中來了，都依賴於多個膠囊填充物的清單。我從不想展示所有填充物。我只想根據選定的膠囊顯示填充物。有4個膠囊可供用戶選擇。例如，當用戶選擇＃0膠囊時，我希望填充列表更改爲僅顯示與＃0膠囊相關的填充物。其他膠囊也是如此。

動態修改填充符列表以僅顯示基於所選膠囊的填充符的最佳方式是什麼？我是否想調用我的C＃方法來檢索填充符列表並傳入所選擇的膠囊，這將涉及回傳？或者有沒有更好的方式通過客戶端來實現？

Answer 1

1. 使用名爲GetFillersByCapsule（int capsuleTypeId）的方法創建控制器。這應該返回json對象上的填充符。

2. 如果您在客戶端使用jQuery，您應該編寫一個函數，以便對此控制器方法執行ajax調用。將調用綁定到document.ready並將其更改爲dropdown。事情是這樣的：

   <script> 
   var dropdown = $("#dropdownId"); //Declare this first so you don't have to search the DOM each time 
   function getFillers(){ 
       $.ajax("yourControllerMethodUrlHere", { 
       data: {id: dropdown.val()}, 
       type: "GET", 
       contentType: "application/json", 
       dataType: "json", 
       success: function (result) { 
        //Use the resulting JSON here to repopulate the list containing the fillers 
       }, 
   } 
   $(document).ready(function(){ 
       fill 
   });