dojo - 如何在Dgrid selection mixin中获取选定行的列表

Question

我在 Dgrid ondemandgrid 中使用 Selector 和 Selection Mixin。我使用复选框作为选择器。以下是我的问题。

1. 如何在 html 按钮单击时获取 javascript 中已检查行的列表？我知道有一个 dgrid-select 和取消选择事件，但我想要按钮单击事件上所有选定行的列表。
2. 目前，如果我点击任何位置的一行，复选框就会被选中。但我只想在点击复选框时选择该行。如何实现这一点？

这是我的代码

             require([
        "dgrid/OnDemandGrid",
        "dojo/store/JsonRest",
        "dojo/dom",
        "dojo/dom-style",
        "dojo/_base/declare",
        "dgrid/extensions/ColumnResizer",
        "dgrid/Selection", 
        "dgrid/selector"
    ], function (OnDemandGrid,JsonRest,dom,domStyle,declare,ColumnResizer,Selection, selector) {
            var Layout = [
                 selector({ label: selector({}), selectorType: "checkbox" }),
                 {field: 'srno',label: 'Sr No'},
                 {field: "Name",label: "name"}
            ];
            jsonstore = new JsonRest({target: url,idProperty: "srno"});
            grid = new(declare([OnDemandGrid,ColumnResizer,Selection]))({
                store: jsonstore,
                columns: Layout,
                minRowsPerPage : 40,
                maxRowsPerPage : 40,
                keepScrollPosition : true,
                allowSelectAll: true,
                loadingMessage: "Loading data...",
                noDataMessage: "No results found."
            }, "grid");
            domStyle.set(dom.byId("grid"),"height","210px");                
            grid.startup();
            grid.on("dgrid-select", function(event){
                    //
            });
            grid.on("dgrid-deselect", function(event){
                    //
            });

        });

Answer 1

以下是您的问题的解决方案：

    var Layout = [
             selector({ label: '', sortable: false}),
             {field: 'srno',label: 'Sr No'},
             {field: "Name",label: "name"}
        ];
        jsonstore = new JsonRest({target: url,idProperty: "srno"});
        grid = new(declare([OnDemandGrid,ColumnResizer,Selection]))({
            store: jsonstore,
            columns: Layout,
            minRowsPerPage : 40,
            maxRowsPerPage : 40,
            selectionMode: "none",
            deselectOnRefresh: false,
            keepScrollPosition : true,
            allowSelectAll: true,
            loadingMessage: "Loading data...",
            noDataMessage: "No results found."
        }, "grid");



    new Button({
        label: "Ok",
        onClick: function () {

             // here you can use grid.selection to get the list of selected rows.
             // it is an object with { 'rowid': true} format  for example, like below 
            array.forEach(grid.store.data, function (item) {
                if (grid.selection[item.id]) {
                    //your code to handle this selected item
                }
            });
        })
    }, 'button');

Answer 2

this.grid.on(".dgrid-row:dblclick", function(vet) {
    // your selected row
    var row = self.grid.row(vet);
});

Answer 3

对于 1：声明一个var selection = []; then，

   grid.on("dgrid-select", function(event){
            var selected = grid.selection;
        if (selected) {
            for (row in selected) {
                selection.push(row);
            }
        }
    });

并将其拼接在 dgrid-deselect 上，然后在单击按钮时访问数组。

对于 2：使用selectionMode: "none", 来自文档定义网格：https ://github.com/SitePen/dgrid/wiki/Selection

Answer 4

您可以在此处理程序中获取选定的行。selectedRows变量为您提供网格中的任何选定项目

   window.grid = new (declare([Grid, ColumnResizer, Selection]))({
                store: jsonstore,
                columns: Layout,
                minRowsPerPage: 40,
                maxRowsPerPage: 40,
                keepScrollPosition: true,
                allowSelectAll: true,
                loadingMessage: "Loading data...",
                noDataMessage: "No results found."
            }, "grid");

            window.grid.on("dgrid-select", function (event) {


                var selectedRows = event.rows;

            });