根据行内容显示或隐藏 DGrid 选择器答案

【问题标题】：Make DGrid selector shown or hidden based on row content根据行内容显示或隐藏 DGrid 选择器
【发布时间】：2015-04-23 00:52:33
【问题描述】：

我将 Dgrid 选择网格用于使用复选框选择内容的网格。但是，只有树的子节点应该显示复选框，因为父节点只是类别，不能被选中。以前我为此使用了编辑器插件，但它在清除选择时产生了困难（具体来说，网格的“clearSelection”方法什么也没做）。我切换到选择器插件，所以现在选择和取消选择行工作正常，但现在我似乎无法找到隐藏某些行而不是其他行的复选框的方法。

原始代码

var columns = [
    editor({
        label: " ",
        field: "itemSelected",
        sortable: false,
        width: 33,
        canEdit: function(object) {
            // only add checkboxes for child objects
            return object.type === "child";
        }
    }, "checkbox"),
    tree({
        label: "Item",
        field: "shortItemId",
        width: 150, 
        shouldExpand: function() {
            return 1;
        }
    }),
    {
        label: "Grouping Name",
        field: "groupingName"
    }
];

var itemGrid = new SelectionGrid({
    store: itemStore,
    style: {
        width: '99%',
        height: '99%'
    },
    columns: columns,
    sort: [{attribute: "shortItemId", descending: false}]
});

我使用编辑器的“editOn”参数隐藏复选框，但是选择器插件只有“禁用”参数，根本没有隐藏字段。

有没有办法像使用编辑器一样使用选择器隐藏复选框？

【问题讨论】：

标签： dojo grid selection selector dgrid

【解决方案1】：

查看dgrid/selector 源，似乎输入总是被创建并添加到DOM，不管它是否被禁用。大概这是为了让它足够灵活，可以即时启用和禁用复选框，而无需不断地重新创建 DOM 节点。虽然无法阻止这些节点被渲染，但可以使用 CSS 隐藏它们，因为单元节点被赋予了一个格式为 field-{fieldName} 的类（或者在这种特殊情况下，field-itemSelected）：

// JavaScript
var columns = [
    selector({
        label: " ",
        field: "itemSelected",
        sortable: false,
        width: 33,
        // Disable any checkbox that is not of type "child"
        disabled: function (item) {
            return item.type !== 'child';
        }
    }),
    ...
];

/* CSS */
.field-itemSelected input[disabled] {
    display: none;
}

【讨论】：