使用KendoUI for MVC3从数据库获取数据到组合框

时间:2012-09-13 07:30:23

标签: asp.net-mvc-3 visual-studio-2010 c#-4.0 kendo-ui

我正在使用MVC3和KendoUI。

我可以通过手动将值传递给组合框来检索数据,并且可以在执行时看到组合框中的值。

这是通过手动传递值

            $("#input").kendoComboBox({
                dataTextField: "text",
                dataValueField: "value",
                dataSource: [
                        { text: "Cotton", value: "1" },
                        { text: "Polyester", value: "2" },
                        { text: "Cotton/Polyester", value: "3" },
                        { text: "Rib Knit", value: "4" }
                    ],
                filter: "contains",
                suggest: true,
                index: 3
            });

现在我需要从SQL Server 2008中检索数据。

说我的表名是产品


产品名称< - 这是我的专栏名称,后跟其中的值。 ABC 高清 GHI

我该怎么做?

我对这个KendoUI和MVC都很新。

请帮助

谢谢,

1 个答案:

答案 0 :(得分:1)

哟伙伴,

组合框的客户端配置应与此非常相似。 http://demos.kendoui.com/web/combobox/remotedatasource.html

e.g。

<script>
  jQuery("#products").kendoComboBox({
    "dataSource": {
        "transport": {
            "read": {
                "url": "/razor/web/Home/GetProducts",
                "data": function() {
                    return kendo.ui.ComboBox.requestData("#products");
                }
            }
        },
        "serverFiltering": true,
        "filter": [],
        "schema": {
            "errors": "Errors"
        }
    },
    "dataTextField": "ProductName",
    "dataValueField": "ProductID",
    "filter": "contains"
});​
</script>

使用服务器方法进行此类配置,您需要创建一个返回JsonResult的操作方法,最重要的部分是集合中的每个对象都应包含名称为 ProductName ProductID的属性表示用于组合的名称和ID。

public JsonResult GetProducts(string text)
    {
        var northwind = new NorthwindDataContext();


        var products = northwind.Products.Select(product => new ProductViewModel
        {
            ProductID = product.ProductID,
            ProductName = product.ProductName,
            UnitPrice = product.UnitPrice ?? 0,
            UnitsInStock = product.UnitsInStock ?? 0,
            UnitsOnOrder = product.UnitsOnOrder ?? 0,
            Discontinued = product.Discontinued
        });

        if (!string.IsNullOrEmpty(text))
        {
            products = products.Where(p => p.ProductName.Contains(text));
        }

        return Json(products, JsonRequestBehavior.AllowGet);
    }