Ext.ux.grid.NullSelectionModel

[exquisitus]

Hey all. Please read here for some background info on why.

A SelectionModel that selects nothing. Use the NullSelectionModel in cases
where the behavior of a selection model is not desired. Please take notice
that the GridPanel control defaults to RowSelectionModel when a selection
model is not specified. This means specifying null for a selection model
will not achieve the desired result.

Ext.ns('Ext.ux.grid');

/**
* @class Ext.ux.grid.NullSelectionModel
* @extends Ext.grid.AbstractSelectionModel
* A SelectionModel that selects nothing. Use the NullSelectionModel in cases 
* where the behavior of a selection model is not desired. Please take notice
* that the GridPanel control defaults to RowSelectionModel when a selection
* model is not specified. This means specifying null for a selection model
* will not achieve the desired result.
* @constructor
* @param {Object} config
*/
Ext.ux.grid.NullSelectionModel = Ext.extend(Ext.grid.AbstractSelectionModel, {
    constructor: function(config) {
        Ext.apply(this, config);
        Ext.ux.grid.NullSelectionModel.superclass.constructor.call(this);
    },
    // private
    onEditorKey: function(field, e) {
        /* Does nothing. Declared only because the GridPanel control calls this function. */
    },
    // private
    initEvents: function() {
        /* Does nothing. Declared only because the GridPanel control calls this function. */
    }
});

[mitchellsimoens]

or...

grid.getSelectionModel.on('beforerowselect', function() { return false; });

[exquisitus]

And I did try that well before implementing this NullSelectionModel bit. It did not yield the results I was expecting. Please give attention to this post for some background info on the problem.

Or to re-iterate in different words... I am using a cell renderer to output dropdown controls (select element) into a cell. And whenever the select element received focus, the RowSelectionModel would cause the select element to lose focus.

The end user's experience would be this:

1. user locates a dropdown box on the screen
2. user clicks the down arrow button
3. the dropdown list appears on the screen followed by disappearing instantly
4. the row's background color changes to indicate a selected row
5. since at this time the list is no longer visible - user re-clicks the down arrow button
6. the dropdown list appears on the screen and stays visible this time
7. user selects an item from the dropdown list
8. user locates a dropdown box on anther row

Repeat the these steps for 20 or so rows and this becomea an annoying user experience. This user experience only happened in IE.

I tried the "beforerowselect" event, which did prevent the row from being selected, however, the user experience was the same otherwise.

[mitchellsimoens]

This user experience only happened in IE.

Love it

[exquisitus]

I would also like to point out that even if you do hook into the RowSelectionModel's "beforerowselect" event in order to prevent a row from being selected, there is still some other funky focus behavior that the RowSelectionModel performs.

So if this funky focus behavior poses itself as a problem in your situation then you naturally need to find a solution.