如何填充Kendo UI下拉列表

时间:2016-03-28 08:24:51

标签: asp.net-mvc kendo-ui-mvc

我需要将数据从数据库绑定到kendoUI Dropdownlist。我试过以下。但似乎没有用。你能否建议

View: Preview.cshtml
   
@{
        //Layout = null;
    }
    <link href="/Content/MenuBar.css" rel="stylesheet" />
    <style>
    h2 {
        font-size: 1.3em;
        margin-bottom: 5px;
        color: #f90;
    }
        </style>
    <!DOCTYPE html>
    <h2>Reports</h2>
    @(Html.Kendo().DropDownList()
                 .Name("DeskDropDown")
                              //.Events(e => e.Change("onDeskDropDownChanged"))
                              .OptionLabel("Select Product...")
                                  .DataTextField("ProductName")
                                  .DataValueField("ProductId")
                                  .DataSource(source => source.Read(read => read.Action("GetProducts", "Home")))
                          
                
     )


Controller Name: Home
public JsonResult GetProducts()
        {
            
           var data = new[] { new { ProductId = 1, ProductName = "abc"` }, new { ProductId = 2, `ProductName = "xyz"` } }; 
            return Json(data, JsonRequestBehavior.AllowGet);
}

每当我运行代码时,下拉列表中都没有显示结果

1 个答案:

答案 0 :(得分:0)

我会这样写你。 这也很有帮助:https://demos.telerik.com/aspnet-mvc/dropdownlist/remotedatasource

MVC包装器。

@(Html.Kendo()
    .DropDownList()
    .Name("someName")
    .DataTextField("Foo")
    .DataValueField("Foo")
    .DataSource(ds => ds
        .Read(read => read.Action("GetBar", "FooController").Type(HttpVerbs.Post)))
    )

FooController

public ActionResult GetBar([DataSourceRequest] DataSourceRequest request)
{
    List<Bar> data = new List<Bar>();
    return Json(data);
}