Question

我的数据源使用控制器方法（ASP MVC）抓取行。我需要设置一些内容，以便用户无法从网格中删除所有行，因此当点击gris id中最后一行的删除按钮时，它需要意识到它是最后一行，并且只是说不。我一直在尝试使用DataSource.Total（）方法，这是我到目前为止所处的位置：

        $("#location-list").kendoGrid({
            dataSource: ds_locationsList,
            sortable: true,
            height: "150px",
            width: "300px",
            editable: "inline",
            columns: [{
                field: "LocationName", title: "Trespassed Location(s)"
            }, {
                command: [{
                    name: "destroy",
                    text: "Delete",
                    click: function(){
                        var rowCount = ds_locationsList.total();

                        if (rowCount < 1) {
                            $("#dialog").dialog({
                                modal: true,
                                buttons: {
                                    Ok: function () {
                                        $(this).dialog("close");
                                    }
                                }
                            });
                            return false;
                        }
                      }
                    }], 
                    width: "110px"
            }]
        });

这不起作用，我想我需要从destroy函数外部获取rowCount，也许在某种'afterLoad'中。我也试过在外面做这一切，但在这两种情况下都没有发生：

        $(".k-grid-delete").on("click", function () {
            var rowCount = ds_locationsList.total();

            if (rowCount < 1) {
                $("#loclistval").removeClass("hidden");
                return false;
            }
        });

有人必须这样做吗？有什么建议？

================================ EDIT ============== ========================

如下所述，我尝试过自定义删除功能，但它只从客户端删除。我尝试了debuggin，但是我在delete函数中输入的断点永远不会被击中，所以我必须搞乱这个调用。这是我的运输代码：

        transport: {
                    read: {
                        url: '@Url.Action("JsonPopulateTrespassList", "TrespassOrder")/' + PersId,
                        dataType: 'json',
                        type: "POST"
                    },
                destroy: {
                        url: '@Url.Action("JsonDeleteLocation", "TrespassOrder")',
                        dataType: 'json',
                        type: "POST"
                    }
        },

和我的参数图：

         parameterMap: function (options, operation) {
             if (operation == "destroy" && options.models) {
                 var values = {};
                 values["TrespassLocId"] = options.models[0].TrespassLocId;
                 return values;
             }
         },

自定义删除：

function locDelete(e) {
    var len = this.dataSource.data().length;

    if (len === 1) {
        alert("There must be at least one location.");
    }
    else {
        this.removeRow($(e.target).closest("tr"));
    }
}

和网格代码：

       $("#trespassed-location-list").kendoGrid({
            dataSource: ds_locationsList,
            sortable: true,
            height: "150px",
            width: "300px",
            editable: "incell",
            columns: [{
                field: "LocationName", title: "Trespassed Location(s)"
            }, {
                command: [{ name: "destroy", text: "Delete", click: locDelete }],
                width: "110px",
            }] 
       });

因此它从客户端删除了行，但没有从服务器端删除。但是当我尝试调试时，locDelete函数上的断点永远不会被击中，所以我确定发生了什么。

Answer 1

问题是，在删除行时会触发remove事件，而对于停止它则为时已晚。

因此，最简单的方法是定义执行验证的custom command。

将网格命令定义为：

columns   : [
    {
        command: [
            ...,
            { name: "Remove", click: obDelete }
        ],
        ...
    },
    ...
]

然后将obDelete定义为：

function obDelete(e) {
    var len = this.dataSource.data().length;
    if (len === 1) {
        alert("last");
    } else {
        this.removeRow($(e.target).closest("tr"));
    }
}

在此处运行示例：http://jsfiddle.net/OnaBai/bxxqC/

添加验证到kendo网格销毁按钮

1 个答案: