Question

我有一个koGrid，我想从行中只选择一些单元格（2个单元格）。如果使用canSelectRows: true属性，我可以选择整行 - 我不需要这个。如何从koGrid行中选择某些单元格？

网格来源：

 this.gridOptions = {
        data: self.people,
        enablePaging: true,
        pagingOptions: self.pagingOptions,
        useExternalSorting: true,
        sortInfo: self.sortingOptions,
        enableColumnResize: false,
        keepLastSelected: false,
        multiSelect: true,
        showColumnMenu: false,
        showFilter: false,
        canSelectRows: false,
        columnDefs: [{
            field: "Age",
            displayName: "Age",
            width: "33.3%",
            sortable: true
        },
        {
            field: "Address",
            displayName: "Address",
            width: "33%",
            sortable: true
        },
         {
             field: "Website",
             displayName: "Website",
             cellTemplate:
                 '<div>' +                   
                ' <a data-bind="attr: {href:\'linkAddress'">People</a>' +
                '</div>',
             width: "33%"
         }],

        selectedItems: self.selectedItems,
        plugins: [new koGridSetDefaultSortingPlugin(this.sortingOptions), new koGridSetNextPagePlugin()]

    };

Answer 1

我已经使用了列模板，尽管那时候我只想要一个单元格可以点击。

<script type="text/html" id="removePostCodeTmpl">
    <div data-bind="attr: { 'class': 'kgCellText colt' + $index() },
    text: $data.getProperty($parent),
    click: function (itemRow, event) { $userViewModel.removePostcode($parent.entity); },
    style: { cursor: 'pointer' }"></div>
</script>

<script type="text/html" id="addPostCodeTmpl">
    <div data-bind="attr: { 'class': 'kgCellText colt' + $index() },
    text: $data.getProperty($parent),
    click: function (itemRow, event) { $userViewModel.addPostcode($parent.entity); },
    style: {
        cursor: $parent.entity.PostcodeGroupId === null ? 'pointer' : 'default',
        backgroundColor: $parent.entity.PostcodeGroupId === null ? '' : '#cc4444'
    }"></div>
</script>

我在html页面中有这些模板，我不喜欢在后端生成UI，它隐藏了它。

columnDefs:
    [
        { field: 'Name', displayName: 'Search Results', cellTemplate: $('#removePostCodeTmpl').html(), width: '*' },
        { field: 'Data', displayName: 'Search Results', cellTemplate: $('#addPostCodeTmpl').html(), width: '*' }
    ]

如果您愿意，也可以将它们一起滚动到行模板中。

如何从koGrid行中选择某些单元格？

1 个答案: