Kendo UI网格中的多个单选按钮，带有内联和批量编辑功能

Question

我认为我会做一些简单的事情，因为Kendo UI已经可以做到这么多，唉它并不像我想象的那么简单。单选按钮使其变得困难。

我正在尝试创建权限掩码，就像您在此处看到的那样：

相应的，几乎正常工作的JSFiddle： http://jsfiddle.net/oz0b7xcu/

目前我将View，Edit和None作为单独的列 - 我可以将它们想象为enum。

我想出了如何使用template＆amp; editor每field boolean显示带有单选按钮的PermissionMask而不是＆＃34; true＆＃34; /＆＃34; false＆＃34; 。

我的问题：

• 目前，内联编辑器仅在我点击下一步到单选按钮时才会做出反应。只有在激活后我才能选择它。在＆＃34;离开＆＃34;该字段，该值不会持久化。 （在JSFiddle中试试）
• 如何创建＆＃34;保存更改的权限＆＃34;按钮？每个更改的权限我需要一个事件并将其添加到某个数组
• 如何让它在多个页面上工作，持续保存当前权限＆＃34;更改集合＆＃34;
• 如何将已编辑的行设置为＆＃34;脏＆＃34; /＆＃34;已更改＆＃34;？

我认为我想要做的很清楚：

• 我有一个有权限的用户列表
• 我希望能够快速编辑所有用户（批量），只需选择查看/编辑/无（独家）
• 可能有更改行的可视化（脏）
• 当我完成后，我想获得所有已更改权限的列表

PS：使用＆＃34;虚拟列＆＃34;可能所有这些都会更容易只有一个{{1}}字段，并根据其值填充虚拟列。可能？也许更好的解决方案？我不依赖任何数据源，所以我可以在这里定义不同的东西......

Answer 1

如果除了单选按钮之外没有任何其他可编辑字段，我觉得您不需要使网格可编辑，您仍然可以使其工作。我对你的小提琴中的代码做了一些修改。这是代码。 （只有更改的代码）

columns: [
            { field: "Name" }, {
                field: "View",
                width: "80px",
                template: "<input type='radio' name='#: uid #' onclick='markDirty(this);' />"
            }, {
                field: "Edit",
                width: "80px",
                template: "<input type='radio' name='#: uid #' onclick='markDirty(this);' />"
        }, {
            field: "None",
            width: "80px",
            template: "<input type='radio' name='#: uid #' onclick='markDirty(this);'/>"

我们可以在选择更改时手动将记录标记为脏。

function markDirty(ctrl) {
        $("#grid").data("kendoGrid").dataSource.getByUid(ctrl.name).dirty = true;
    }

最后，您可以在按钮单击时从网格中获取数据源并执行所需的任何操作。

//this will have the data in an array
var data = $("#grid").data("kendoGrid").dataSource.data();

希望这有帮助。