PDA

View Full Version : how to deselect the the grid main check box when one row is deselect



@naresh
25 May 2013, 3:18 AM
hi ,
i am using the extjs 3.4 and i want to select the multiple rows in a grid so i see the example the link given below:
http://dev.sencha.com/deploy/ext-3.4.0/examples/grid/grid-plugins.html




in this example also when i check the company check box all is selected and when i unchecked all is deselected .
but when i deselect the only one row of the the company check box is not deselected .


so please suggests me to solved the problem

mitchellsimoens
28 May 2013, 6:08 AM
You would need to extend the checkbox selection model to handle this. This may get you quite far:


Ext.ns('Ux.grid');

Ux.grid.CheckboxSelectionModel = Ext.extend(Ext.grid.CheckboxSelectionModel, {
/**
* @property {Boolean} inBatch
* Allows the syncing of a header only once instead of each select/deselect
*/
inBatch : false,

selectAll : function() {
this.inBatch = true;

Ux.grid.CheckboxSelectionModel.superclass.selectAll.call(this);

this.inBatch = false;

this.syncHeader();
},

clearSelections : function(fast) {
this.inBatch = true;

Ux.grid.CheckboxSelectionModel.superclass.clearSelections.call(this, fast);

this.inBatch = false;

this.syncHeader();
},

selectRow : function(index, keepExisting, preventViewNotify) {
Ux.grid.CheckboxSelectionModel.superclass.selectRow.call(this, index, keepExisting, preventViewNotify);

if (!this.inBatch) {
this.syncHeader();
}
},

deselectRow : function(index, preventViewNotify) {
Ux.grid.CheckboxSelectionModel.superclass.deselectRow.call(this, index, preventViewNotify);

if (!this.inBatch) {
this.syncHeader();
}
},

syncHeader : function() {
var grid = this.grid,
store = grid.getStore(),
view = grid.getView(),
headersEl = Ext.get(view.innerHd),
header = headersEl.child('div.x-grid3-hd-checker'),
selections = this.selections;

if (selections.getCount() === store.getCount()) {
header.addClass('x-grid3-hd-checker-on');
} else {
header.removeClass('x-grid3-hd-checker-on');
}
}
});

Ext.onReady(function () {

var xg = Ext.grid;

// shared reader
var reader = new Ext.data.ArrayReader({}, [
{name : 'company'},
{name : 'price', type : 'float'},
{name : 'change', type : 'float'},
{name : 'pctChange', type : 'float'},
{name : 'lastChange', type : 'date', dateFormat : 'n/j h:ia'},
{name : 'industry'}
]);

var sm = new Ux.grid.CheckboxSelectionModel();
new xg.GridPanel({
store : new Ext.data.Store({
reader : reader,
data : xg.dummyData
}),
cm : new xg.ColumnModel({
defaults : {
width : 120,
sortable : true
},
columns : [
sm,
{id : 'company', header : "Company", width : 200, dataIndex : 'company'},
{header : "Price", renderer : Ext.util.Format.usMoney, dataIndex : 'price'},
{header : "Change", dataIndex : 'change'},
{header : "% Change", dataIndex : 'pctChange'},
{header : "Last Updated", width : 135, renderer : Ext.util.Format.dateRenderer('m/d/Y'), dataIndex : 'lastChange'}
]
}),
sm : sm,
columnLines : true,
width : 600,
height : 300,
frame : true,
title : 'Framed with Checkbox Selection and Horizontal Scrolling',
iconCls : 'icon-grid',
renderTo : document.body
});

});

Ext.grid.dummyData = [
['3m Co', 71.72, 0.02, 0.03, '9/1 12:00am', 'Manufacturing'],
['Alcoa Inc', 29.01, 0.42, 1.47, '9/1 12:00am', 'Manufacturing'],
['Altria Group Inc', 83.81, 0.28, 0.34, '9/1 12:00am', 'Manufacturing'],
['American Express Company', 52.55, 0.01, 0.02, '9/1 12:00am', 'Finance'],
['American International Group, Inc.', 64.13, 0.31, 0.49, '9/1 12:00am', 'Services'],
['AT&T Inc.', 31.61, -0.48, -1.54, '9/1 12:00am', 'Services'],
['Boeing Co.', 75.43, 0.53, 0.71, '9/1 12:00am', 'Manufacturing'],
['Caterpillar Inc.', 67.27, 0.92, 1.39, '9/1 12:00am', 'Services'],
['Citigroup, Inc.', 49.37, 0.02, 0.04, '9/1 12:00am', 'Finance'],
['E.I. du Pont de Nemours and Company', 40.48, 0.51, 1.28, '9/1 12:00am', 'Manufacturing'],
['Exxon Mobil Corp', 68.1, -0.43, -0.64, '9/1 12:00am', 'Manufacturing'],
['General Electric Company', 34.14, -0.08, -0.23, '9/1 12:00am', 'Manufacturing'],
['General Motors Corporation', 30.27, 1.09, 3.74, '9/1 12:00am', 'Automotive'],
['Hewlett-Packard Co.', 36.53, -0.03, -0.08, '9/1 12:00am', 'Computer'],
['Honeywell Intl Inc', 38.77, 0.05, 0.13, '9/1 12:00am', 'Manufacturing'],
['Intel Corporation', 19.88, 0.31, 1.58, '9/1 12:00am', 'Computer'],
['International Business Machines', 81.41, 0.44, 0.54, '9/1 12:00am', 'Computer'],
['Johnson & Johnson', 64.72, 0.06, 0.09, '9/1 12:00am', 'Medical'],
['JP Morgan & Chase & Co', 45.73, 0.07, 0.15, '9/1 12:00am', 'Finance'],
['McDonald\'s Corporation', 36.76, 0.86, 2.40, '9/1 12:00am', 'Food'],
['Merck & Co., Inc.', 40.96, 0.41, 1.01, '9/1 12:00am', 'Medical'],
['Microsoft Corporation', 25.84, 0.14, 0.54, '9/1 12:00am', 'Computer'],
['Pfizer Inc', 27.96, 0.4, 1.45, '9/1 12:00am', 'Services', 'Medical'],
['The Coca-Cola Company', 45.07, 0.26, 0.58, '9/1 12:00am', 'Food'],
['The Home Depot, Inc.', 34.64, 0.35, 1.02, '9/1 12:00am', 'Retail'],
['The Procter & Gamble Company', 61.91, 0.01, 0.02, '9/1 12:00am', 'Manufacturing'],
['United Technologies Corporation', 63.26, 0.55, 0.88, '9/1 12:00am', 'Computer'],
['Verizon Communications', 35.57, 0.39, 1.11, '9/1 12:00am', 'Services'],
['Wal-Mart Stores, Inc.', 45.45, 0.73, 1.63, '9/1 12:00am', 'Retail'],
['Walt Disney Company (The) (Holding Company)', 29.89, 0.24, 0.81, '9/1 12:00am', 'Services']
];