How to get the list of selected rows in Dgrid selection mixin

SSayee picture SSayee · Sep 7, 2013 · Viewed 9.5k times · Source

I am using Selector and Selection Mixin in Dgrid ondemandgrid.I am using checkbox as a selector.Below are my questions.

  1. How to get the List of Checked rows in a javascript on a html button click?I know there is a dgrid-select and deselect events,but i want the list of all the selected rows on a button click event.
  2. Currently , if i click on a row at any position ,the checkbox is getting selected.But I want to select the row only when i click on the checkbox.How to achieve this?

Here is my code

             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

Sean Zhao picture Sean Zhao · Sep 25, 2013

Here is the solution of your questions:

    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');