Grid: Selecting multiple rows using checkbox

[amitava]

Hi,
How to select multiple rows in a grid with checkboxes? Can anyone please help with sample codes...

TIA

[tryanDLS]

Look at the grid examples. You can render a column as checkboxEditor.

[amitava]

Look at the grid examples. You can render a column as checkboxEditor.

Thanks. I do have checkboxes in the grid, but I am trying to do something like gmail inbox where clicking a checkbox selects/deselects the row and changes the row bgcolor. Though I am not using checkboxEditor but a custom renderer for that column which returns <input type="checkbox"> instead.
Here is the code

/* load existing orders in a grid */
loadOrders: function(){
	// create the datastore
	var ds = new Ext.data.Store({
		// load using HTTP
		proxy: new Ext.data.HttpProxy({url: '/orders/orders', method: 'GET'}),
		// the return will be XML, so lets set up a reader
		reader: new Ext.data.XmlReader({
			// records will have a "order" tag
			record: 'order'
			}, [
			{name: 'OrderNo', mapping: 'OrderNo'},
			{name: 'Status', mapping: 'Status'},
			{name: 'ExamDate', mapping: 'ExamDate'},
			{name: 'PatientName', mapping: 'PatientName'},
			{name: 'Radiologist', mapping: 'Radiologist'},
			{name: 'Site', mapping: 'Site'},
			{name: 'Technician', mapping: 'Technician'},
			{name: 'ReferringMD', mapping: 'ReferringMD'}				
		])
	});
	var cm = new Ext.grid.ColumnModel([
		{width:30, renderer: cr, resizable:false},
		{header: "Order No", width:70, dataIndex: "OrderNo"},
		{header: "Status", width:70, dataIndex: "Status"},
		{header: "Exam Date", width:150, dataIndex: "ExamDate"},
		{header: "Patient Name", width:150, dataIndex: "PatientName"},
		{header: "Radiologist", width:150, dataIndex: "Radiologist"},
		{header: "Site", width:70, dataIndex: "Site"},
		{header: "Technician", width:70, dataIndex: "Technician"},
		{id: 'g-rmd', header: "Referring MD", width:150, dataIndex: "ReferringMD"}
	]);
	cm.defaultSortable = true;
	
	ordersGrid = new Ext.grid.Grid('order-grid', {
		ds: ds,
		cm: cm,
		autoExpandColumn: 'g-rmd',
		selModel: new Ext.grid.RowSelectionModel({multipleSelect:true})
	});
	ordersGrid.render();
	
	var gridFoot = ordersGrid.getView().getFooterPanel(true);
	
	// add a paging toolbar to the grid's footer
	var paging = new Ext.PagingToolbar(gridFoot, ds, {
		pageSize: 10,
		displayInfo: true,
		displayMsg: 'Displaying orders {0} - {1} of {2}',
		emptyMsg: "No orders to display"
	});
	
	// add the detailed view button
	paging.add('-', {
		text: 'View Details',
		cls: 'x-btn-text-icon'
	});
	
	ds.load({params:{start:0, limit:10}});
	
	ordersGrid.getSelectionModel().selectFirstRow();
	
	//custom renderer for first column
	function cr(){
		return "<input type='checkbox' class='chk'>";
	}
}

I am really stuck here running out of ideas, don't know how to force selection of a row clicking on a checkbox. :oops: Any help is much appreciated.

[ueverson]

It looks at in this site. You it will find what it looks for.

http://extjs.com/playpen/ext-2.0/exa...rid/grid3.html

[Hutch]

http://extjs.com/playpen/ext-2.0/exa...rid/grid3.html

This cool ~ I want it.

[cecol]

I want to use Ext.gird.Grid3!
where can i download ext2.0

[abal2.antz]

But, How I get value from selected rows?
because, I want to send the value to another grid.

Thank you

regards,
Anton Mulyadi