使用ajax的MVC多级联下拉筛选表

Question

我想要多个下拉列表筛选同一页上的表。当你转到页面时，当你选择第一个下拉菜单时，它会显示一个表格，缩小数据并更新第二个下拉菜单。

这里有一个例子我的工作MVC Sort headers and Dropdown Ajax update

我可以级联下拉菜单或工作，我可以得到表更新，但我不能让两者。

我想使用ajax，所以页面不会重新加载。

任何指导或例子都会很棒！

Answer 1

我还没有看到你的代码，所以不能说出确切的问题。这是我如何看你的解决方案。首先将您的第二个下拉值添加到您的过滤器方法中，未选择时它应该具有默认值。

public ActionResult Index(string sortOrder, string id, 
           string channelLocation, int secon_ddl = 0) 

如果第二选择然后检查，在这种情况下是它为0，和过滤

if(secon_ddl != 0) 
    { 
     //do whatever 
    } 

添加物品的另一种方法至极返回列表以第二种方法并调用它时firts下拉值改变。最佳选择是JSON格式的返回值。 这里是我的代码，我更新子类别列表时类别变化

('#category_list').change(function() { 
    var cat_value = $(this).val(); 
    $.ajax({ 
     url: '/Product/GetSubCategory', 
     type: "GET", 
     dataType: "JSON", 
     data: { category: cat_value }, 
     contentType: 'application/json', 
     success: function (data) { 
      if (data.length > 0) { 
       var list = $('#subCategory_list'); 
       list.html(""); // clear before appending new list 
       list.append(
         $('<option></option>').val(null).html("Chose")); 
       $.each(data, function (i, subCat) { 
        list.append(
         $('<option></option>').val(subCat.id).html(subCat.name)); 
       }); 
      }    
     } 
    }); 
} 

我使用jQuery的数据表，所以更新表是简单

('#category_list, #subCategory_list').change(function(){ 
     table.draw(); 
}) 

你的情况，这最后的代码应该是完全不同的充。只要确保你的过滤器能够接收到两个下拉列表的值，并且当其中一个下拉列表发生变化时就会触发它。希望这可以帮助你！