自定义 ag-grid 以设置最大可选行数答案

【问题标题】：customizing ag-grid to set a max number of selectable rows自定义 ag-grid 以设置最大可选行数
【发布时间】：2016-07-04 01:31:58
【问题描述】：

我正在尝试在基于 Angular 1.5 的项目中使用 ag-grid 自定义数据表。自定义是允许用户选择表中的最大行数，例如最大为2。

I have the following code by using node.setSelected(false) that I found in the documentation page here, but I got the error: node.setSelected is not a function when the selection exceeds the maximum of 2.

var gridOptions = {
    columnDefs: columnDefs,
    rowSelection: 'multiple',
    onRowSelected: onRowSelected
};


function onRowSelected(event) {
                var curSelectedNode = event.node;
                var selectionCounts = vm.gridOptions.api.getSelectedNodes().length;
                if (selectionCounts > 2) {
                    var oldestNode = vm.gridOptions.api.getSelectedNodes()[0]; // get the first node, to be popped out
                    oldestNode.setSelected(false); // causes the above 'not a function' error
                 }       
            }

有谁知道 ag-grid 的setSelected() API 可能有什么问题？或者有什么更好的方法来进行这种定制？

【问题讨论】：

标签： angularjs datatable row selection ag-grid

【解决方案1】：

原来setSelected(false)方法在其当前的ag-grid API中已经过时了，我发现我可以使用deselectIndex()方法来取消选择最旧的节点：

if (selectionCounts > 2) {
    vm.gridOptions.api.deselectIndex(0, true); // This works!
}

希望这将在未来对其他人有所帮助！

【讨论】：

【解决方案2】：

var columnDefs =[{
                       headerName: 'Name',
                       field: 'name',
                       width: 108,
                       minLength: 1,
                       maxLength: 20,
                       editable: true
}]

- 修改 .js 文件中的原型

TextCellEditor.prototype.init = function (params) {
        var eInput = this.getGui();
        var startValue;

        // Set min & max length
        if (params.column.colDef.maxLength)
            eInput.maxLength = params.column.colDef.maxLength;
        if (params.column.colDef.minLength)
            eInput.minLength = params.column.colDef.minLength;

        // cellStartedEdit is only false if we are doing fullRow editing
        if (params.cellStartedEdit) {
            this.focusAfterAttached = true;
            var keyPressBackspaceOrDelete = params.keyPress === constants_1.Constants.KEY_BACKSPACE
                || params.keyPress === constants_1.Constants.KEY_DELETE;
            if (keyPressBackspaceOrDelete) {
                startValue = '';
            }
            else if (params.charPress) {
                startValue = params.charPress;
            }
            else {
                startValue = params.value;
                if (params.keyPress !== constants_1.Constants.KEY_F2) {
                    this.highlightAllOnFocus = true;
                }
            }
        }
        else {
            this.focusAfterAttached = false;
            startValue = params.value;
        }
        if (utils_1.Utils.exists(startValue)) {
            eInput.value = startValue;
        }
        this.addDestroyableEventListener(eInput, 'keydown', function (event) {
            var isNavigationKey = event.keyCode === constants_1.Constants.KEY_LEFT || event.keyCode === constants_1.Constants.KEY_RIGHT;
            if (isNavigationKey) {
                event.stopPropagation();
            }
        });
    };

【讨论】：