Question

我遇到网格中的复选框列问题。

我有一个包含多个复选框列的网格。当我选中该框时，脏标签不存在，但是当我单击包含复选框的单元格而不是复选框，然后单击复选框时，我会得到脏标记。

以前有人见过这个吗？我希望它更加一致，因为只需点击几下，某些行的脏标记就会消失。

这看起来很奇怪。

谢谢！

Answer 1

是的，我经常看到这个：取决于你如何实现复选框。如果直接勾选复选框，则修改input但不修改模型。如果勾选单元格，然后勾选复选框，则Kendo UI切换到编辑模式，并且（在后台）它会用Kendo UI管理的复选框（事件处理程序）的可编辑版本替换复选框。允许修改模型。

编辑：如果您希望您的复选框始终可以点击，那么您可以这样做：

var grid = $("#stocks_tbl").kendoGrid({
    dataSource: new kendo.data.DataSource({
        ...
        schema: {
            model: {
                id    : "id",
                fields: {
                    active: { type: "boolean" }
                }
            }
        }
    }),
    editable  : "incell",
    columns   : [
        {
            field   : "active",
            title   : "Active",
            template: '<input type="checkbox" data-bind="source: active" #= active ? checked="checked" : ""# />'
        },
        ...
    ]
}).data("kendoGrid");

在此，您可以定义始终可点击的input。

$(document).on("change", "[type='checkbox']", function(ev) {
    var item = grid.dataItem($(this).closest("tr"));
    item.set("active", ev.srcElement.checked);
});

有了这个，我们定义了一个拦截input上的变化的处理程序，并将其反映在model中。

这可以让您免于使用editable

Answer 2

确实，首先您需要单击单元格以进入“编辑”模式，然后您可以选中/取消选中实际的复选框。为了获得更好的用户体验，您可以像this code library article中实现的那样实现复选框。（如果您没有使用ASP.NET MVC包装器 - 不用担心只需打开项目，请转到 Views / Home / Index.cshtml ，您可以复制/粘贴代码 - 它都是JavaScript。

代码库还包括如何在列标题中创建复选框“全选”。

Answer 3

我解决它的方法是使模型中的字段不可编辑，因此它强制触发click事件，然后我只更新值并设置dirty属性。问题是，如果你点击了单元格，编辑事件就会被点击而反之亦然，所以我没有激活两件事，而是禁用了一件。有些人称之为黑客攻击，但我看不出有什么方法可以防止两个事件被解雇。

Answer 4

请尝试这个：

 //Cell click Checkbox select
    $('#grd' + gridName).on("click", "td", function (e) {
        var selectedTd = $(e.target).closest("td");              
         var grdChkBox = selectedTd.parents('tr').find("td:first").find('input:checkbox');
         grdChkBox.prop('checked', !grdChkBox.prop('checked'));

    });

Kendo Grid Checkbox脏标志不一致

4 个答案: