Stopping a checkbox from allowing select in an extjs 4 grid checkbox column via the Ext.selection.CheckboxModel


Here’s the problem, you set up a checkbox model on one of your grids, and you want to perform an action based on the check, or maybe even based on a button above the grid that will go through the model and do something, but you want to make sure the user is not allowed to check rows that don’t meet a certain criteria. In my case it was some missing values in the store, not necessarily showing in the grid. You can accomplish this by intercepting the click event and returning false when your criteria is not met, here’s the code:

var sm_og = Ext.create('Ext.selection.CheckboxModel',{
            // prevent selection of records with invalid descriptions
            beforeselect: function(selModel, record, index) {
                if ((Ext.String.trim( record.get('x_field')) == '')) {
                      Ext.Msg.alert('Please complete the record! ','You cannot check these rows until you complete x field.');
		 return false;	

What you are doing above is checking the value of a field in the record set before deciding to let the checkbox actually become checked. It’s pretty easy to see that you could be testing for numerical values multiple values etc… the same code as above. One important thing to note is the Ext.String.trim() function being used above. I have found that many times the record will come back as a single space and thus is not really blank for comparison purposes, this will trim off the spaces for you.

5 thoughts on “Stopping a checkbox from allowing select in an extjs 4 grid checkbox column via the Ext.selection.CheckboxModel”

    1. Couple of comments. In order to get this to work I neeedd to copy the files ext_datetime.js and ext_searchfield.js from vendor/plugins/ext_scaffold/assets/javascripts/ to public/javascripts/ within my rails project.Thanks for pointing me in the general direction. I was totally lost as to how to fix this otherwise!

Leave a Reply