Tie Checkbox filter state to toolbar button

[mshapiro]

I have a checkbox column
                        { title: "", dataIndx: "state", maxWidth: 30, minWidth: 30, align: "center",
                            cb: { header: true},
                            type: 'checkBoxSelection', cls: 'ui-state-default', resizable: false, sortable: false, editable: false,
                            filter: { type: "checkbox", subtype: 'triple', condition: "equal", listeners: ['click'] }
                        },

I would like to enable a toolbar button if one or more rows are selected and disable it when no rows are selected.  Can this be done with the History event?  Is there another simple way or does it require a listener on the filter?  Thanks.

[paramvir]

It could be done with help of selectChange event. When ui.rows.length > 0, enable the toolbar button, otherwise disable the button.

http://paramquery.com/pro/api#event-selectChange

Example of selectChange event: http://paramquery.com/pro/demos/selection_row

Also fireSelectChange selectionModel.fireSelectChange option should be set to true to use the above event.

http://paramquery.com/pro/api#option-selectionModel

Please let me know if you need further assistance.

[mshapiro]

This does just want I needed, thanks.  The grid in question is in a separate window and is used to select records to be added to the main grid.  Nothing is editable in this grid.  Once the rows have been added to the main grid, is there a way to disable the checkbox filter on just these rows?  Could this be done with AddClass?  Thanks.

[paramvir]

How are you adding rows to the main grid. Is it by copy/paste of selected rows.

[mshapiro]

The selection grid just has a few fields to identify the records that need to be added.  When selected records are added, the information is send to the server and several database tables are updated. The main grid is refreshed from the database when the window containing the selection grid is closed.  It would be nice to identify and then disable the rows in the selection grid so the user can repeat the process multiple times before closing the window.  I can identify the rows by changing the color or some other attribute, but is there a way to hide or disable the checkboxes on just those rows?  Thanks.   

[paramvir]

you can delete non-required rows from selection grid or implement column.render callback to return a disabled checkbox or no checkbox at all for those rows.

column.render = function(ui){
  if(ui.rowData.notwanted ){
     return "";
  }
  else{
    return null; //let the default checkbox renderer do its job.
  }
}

[mshapiro]

The column.render callback does what I needed.  Thanks.

[mshapiro]

Previously I added a selectChange handler which I thought would take care of the enable/disable state for a toolbar button that is only enabled when one or more rows is selected.  This issue I have is the case where multiple rows are selected and then just 1 row is deselected.  When selectChange fires I get ui.rows.length = 0 and the button gets disabled.  It appears that ui.rows just returns the rows of the current selection/deselection event.  Is this correct?  Am I missing something?  Thanks.

                         objAdd.selectChange = function (evt, ui) {

                             var tb = $("#grid_popup").pqGrid("option", "toolbar");

                             var rows = ui.rows;

                             if (rows && rows.length > 0) {
                                 tb.items[2].options.disabled = false;
                             } else {
                                 tb.items[2].options.disabled = true;
                             }
                             $("#grid_popup").pqGrid("option", "toolbar", tb);  // refresh the toolbar
                         }

[paramvir]

ui.rows return a complete snapshot of the current state of selection.

Your event code looks correct but I see you haven't mentioned column.cb.all property.

Please specify it e.g., cb: { header: true, all: true/false}

http://jsfiddle.net/b6b710mz/65/

Please let me know whether it resolves your issue.

[mshapiro]

Specifying cb:All didn't fix it, but in your example you have selectionModel: { type: null.  I was using type: row.  Changing it to type: null resolved the issue.  Thanks.