使用 jquery 绑定 Kendo DataGrid

Question

我正在将信息从控制器传递到如下视图：

return View(data);

如何在视图中访问这些数据以便将数据绑定到 KendoDataGrid？ 我有以下代码：

@model IEnumerable<MyCustomerModel>
<div id="StatementGrid"></div>
<script>
    $(document).ready(function() {
        var lines = [{ TransactionDate: "01/01/2014", TransactionNumber: "001" }];//this works
        var lines2 = @model //How to pass the model information here?

        var grid = $("#StatementGrid").kendoGrid({
            columns: [
                { field: "TransactionDate", title: "Date" },
                { field: "TransactionNumber", title: "Transaction Number" }
            ],
            dataSource: {
                data:lines
                //data:lines2 //this does not work
            }
        });

    });
</script>

Answer 1

您可以 Json 编码您的模型并将您的 JavaScript 行变量设置为等于该值，如下所示：

@model IEnumerable<MyCustomerModel>


<div id="StatementGrid"></div>
<script>
    $(document).ready(function() {

        var lines = @Html.Raw(Json.Encode(Model))

        var grid = $("#StatementGrid").kendoGrid({
            columns: [
                { field: "TransactionDate", title: "Date" },
                { field: "TransactionNumber", title: "Transaction Number" }
            ],
            dataSource: {
                data:lines
            }
        });

    });
</script>

您必须设置日期数据类型和格式，但它会起作用。话虽如此，我绝对不推荐这种方法。相反，我会在以下链接中查看有关如何使用远程或本地数据进行绑定的 Telerik 文档，并遵循他们的指导：

http://demos.telerik.com/kendo-ui/web/grid/remote-data.html

http://demos.telerik.com/kendo-ui/web/grid/local-data.html