asp.net-mvc – 使用Ajax在ASP.NET MVC的Kendo UI中级联DropDown

第二个下拉列表对应于产品,并按以下方式从类别级联：

@(Html.Kendo().DropDownList()
      .Name("products")
      .OptionLabel("Select product...")
      .DataTextField("ProductName")
      .DataValueField("ProductID")
      .DataSource(source => {
          source.Read(read =>
          {
              read.Action("GetCascadeProducts","ComboBox")
                  .Data("filterProducts")
                  .Type(HttpVerbs.Post); // This line serves to accept POST requests
          })
          .ServerFiltering(true);
      })
      .Enable(false)
      .AutoBind(false)
      .CascadeFrom("categories")

(注意,我必须添加接受Post请求的行)

在此示例中,您将需要一个具有以下语法的控制器：

[HttpPost]
    public JsonResult GetCascadeProducts(int category)
    {
        List<Product> Products = new List<Product>();

        Products.Add(new Product(1,"Chai"));
        Products.Add(new Product(1,1,"Chang"));
        Products.Add(new Product(1,2,"Guarana Fantastica"));
        Products.Add(new Product(2,"Aniseed Syrup"));
        Products.Add(new Product(2,"Seasoning"));

        var ProductsInCategory = from p in Products where p.CategoryID == category select p;

        return Json(ProductsInCategory);
    }

我班级的模板如下：

public class Product
    {
        public int CategoryID { get; set; }
        public int ProductID { get; set; }
        public string ProductName { get; set; }

        public Product(int category,int id,string name)
        {
            CategoryID = category;
            ProductID = id;
            ProductName = name;
        }
    }

如果你有正确的Javascript函数：

function filterProducts() {
    return {
        category: $("#categories").val()
    };
}

(类别应与控制器方法中的参数名称相同)通常,一切都应该正常工作！