Question

我有一个MVC Kendo Grid，我想通过jQuery Ajax Call来填充它。我使用jQuery＆＃39;每个＆＃39;方法这样做：

function FillRowsByRequest(reqRow) {
        var readDataUrl = '@Url.Action("GetGoodsByReq")';
        var targetGrid = $("#storeReceiptRowsGrid").data("kendoGrid");

        $.get(readDataUrl, { reqseq: reqRow }, function (d, t, j) {
            var counter = 0;
            targetGrid.cancelChanges();
            $(d).each(function (i, e) {
                targetGrid.dataSource.insert(counter++, {
                    GOOD_ID: e.GOOD_ID,
                    GOOD_CODE: e.GOOD_CODE,
                    GOOD_CODE_DESC: e.GOOD_CODE_DESC,
                    GOOD_DESC: e.GOOD_DESC
                });
            });
        });
    }

我可以看到我的Kendo Grid充满了数据（不完全），但事实是，当我点击Save按钮时，它不会触发Save Action Method，因此表格中没有插入任何内容刷新后没什么。

@(Html.Kendo()
    .Grid<Tpph.Models.STORE_RECEIPT_ROW>()
    .Name("storeReceiptRowsGrid")
    .Columns(columns =>
    {
        columns.Bound(o => o.GOOD_ID).Title("Good ID").HtmlAttributes(new { @class = "goodid" }).Visible(false);
        columns.Bound(o => o.GOOD_CODE).Title("Good Code").HtmlAttributes(new { @class = "goodcode" }).Width(100);
        columns.Bound(o => o.GOOD_CODE_DESC).Title("Good Code Desc").HtmlAttributes(new { @class = "goodcodedesc" }).Width(100);
        columns.Bound(o => o.GOOD_DESC).Title("Good Desc").HtmlAttributes(new { @class = "gooddesc" }).Width(155);
    })
    .ToolBar(toolbar =>
    {
        toolbar.Create().Text("New Row").HtmlAttributes(new { @class = "k-primary", style = "background-color: #e6ffe6; border-color: #10c4b2; min-width: 100px; color: black;" });
        toolbar.Save().Text("Save").SaveText("Save").CancelText("Cancel").HtmlAttributes(new { @class = "k-primary", style = "background-color: #e6ffe6; border-color: #10c4b2; min-width: 100px; color: black;" });
    })
    .ColumnMenu()
    .Selectable(s => s.Type(GridSelectionType.Row))
    .Sortable()
    .Editable(editable => editable.Mode(GridEditMode.InCell).DisplayDeleteConfirmation("Delete?"))
    .Filterable()
    .Groupable()
    .Scrollable()
    .Pageable(p => p.Refresh(true))
    .Resizable(resize => resize.Columns(true))
    .Reorderable(reorder => reorder.Columns(true))
    .DataSource(dataSource => dataSource
         .Ajax()
         .Events(ev => ev.RequestEnd("storeReceiptRowsGridOnRequestEnd"))
         .Batch(true)
         .ServerOperation(true)
         .Model(model =>
         {
             model.Id(p => p.GOOD_ID);
         })
         .Read(read => read.Action("StoreReceiptRowsRead", "StorageForms"))
         .Update(u => u.Action("StoreReceiptRowsEdit", "StorageForms"))
         .Create(c => c.Action("StoreReceiptRowsCreate", "StorageForms"))
         .Destroy(de => de.Action("StoreReceiptRowsDestory", "StorageForms")))
    .Events(ev =>
    {
        ev.DataBound("storeReceiptRowsGridOnBound");
    })
    )

我该怎么做？

Answer 1

经过多次努力解决这个问题之后，我终于发现只有当＆＃34;脏＆＃34;时，Kendo Grid才会触发CRUD Action Methods。行的属性设置为true。（脏标志是一个小小的红色三角形，当您编辑该单元格时，它会出现在单元格的一角）。因此，解决此问题的方法是将每行的脏标志设置为true，如下所示：

.set("dirty", true);

所以我的最终JavaScript代码是这样的：

function FillRowsByRequest(reqRow) {
        var readDataUrl = '@Url.Action("GetGoodsByReq")';
        var targetGrid = $("#storeReceiptRowsGrid").data("kendoGrid");

        $.get(readDataUrl, { reqseq: reqRow }, function (d, t, j) {
            var counter = 0;
            targetGrid.cancelChanges();
            $(d).each(function (i, e) {
                targetGrid.dataSource.insert(counter++, {
                    GOOD_ID: e.GOOD_ID,
                    GOOD_CODE: e.GOOD_CODE,
                    GOOD_CODE_DESC: e.GOOD_CODE_DESC,
                    GOOD_DESC: e.GOOD_DESC
                }).set("dirty", true);
            });
        });
    }

通过Ajax调用填充ASP.NET MVC Kendo Grid

1 个答案: