Ext.selection.CheckboxModel checkbox vs row body selection difference

[FCTim]

Hi All,

I wasn't sure if this was a bug but the functionality doesn't make sense to me. I have a normal CheckboxModel with mode = 'MULTI' and a normal Ext.grid.Panel. I noticed that in the code, it will change the selectionMode on you if you are selecting on the checkbox instead of the row body.

Code from Ext.selection.checkboxModel:

        onRowMouseDown: function(view, record, item, index, e) {
            view.el.focus();
            var me = this,
                checker = e.getTarget('.' + Ext.baseCSSPrefix + 'grid-row-checker');
                
            if (!me.allowRightMouseSelection(e)) {
                return;
            }

            // checkOnly set, but we didn't click on a checker.
            if (me.checkOnly && !checker) {
                return;
            }

            if (checker) {
                var mode = me.getSelectionMode();
                // dont change the mode if its single otherwise
                // we would get multiple selection
                if (mode !== 'SINGLE') {
                    me.setSelectionMode('SIMPLE');
                }
            
                me.selectWithEvent(record, e);
                me.setSelectionMode(mode);
            } 
            else {
                me.selectWithEvent(record, e);
            }
        }

My test case is:
1) Select 1 row by clicking on the row body.
2) Hold Shift and click on another row.
3) Hold Shift and click on a third row.
4) Now let go of shift and click on a row. The selection will correctly change to ONLY the last row you selected.

Now repeat that test by clicking on the actual checkbox for each row and at step #4 you will notice that all rows are still selected. I would have assumed that the behavior would be the same no matter where you click on the grid.

You can see this behavior in the grid plugins example: http://docs.sencha.com/ext-js/4-0/#!/example/grid/grid-plugins.html

Thanks,
Tim

[skirtle]

What you describe is the expected behaviour. Users find it counter-intuitive to have to press Ctrl or Shift when clicking on the checkbox and that's what the code you've highlighted fixes.

If you want clicking on the rows to behave the same way as clicking on the checkboxes then just set mode to 'SIMPLE'. This is quite a common way to configure a grid with a checkbox model.

[FCTim]

If you want clicking on the rows to behave the same way as clicking on the checkboxes then just set mode to 'SIMPLE'. This is quite a common way to configure a grid with a checkbox model.

Thanks for your quick response. I actually need the reverse so I guess I will just have to override and comment out the setSelectionMode() part. I was hoping to avoid another override.

Thanks again,
Tim

[skirtle]

That sounds odd to me. I would expect that to be very confusing for your users. Perhaps it would make more sense to just use a row model instead of a checkbox model?

[FCTim]

I agree, now if I could just convince the decision makers.

[mitchellsimoens]

Since you are overriding, I would get rid of the 'check all' checkbox then too. I would also suggest changing from a checkbox to a radio. This is simple as the checkbox isn't really a checkbox but just some CSS classes using an images.

[FCTim]

Since you are overriding, I would get rid of the 'check all' checkbox then too. I would also suggest changing from a checkbox to a radio. This is simple as the checkbox isn't really a checkbox but just some CSS classes using an images.

Really the root of the problem is that the users have been trained that a checkbox means you can select a row and not having a checkbox means you can't. I think making it a radio would confuse matters more.

P.S. I went back to our old version of the app (3.x) and noticed that we are using base functionality so I'll remove my override and hopefully won't get any complaints.

Thank you guys for the support.