Selection Grid

To make the grid rows selectable, you need to install the ezEditTable extension, enable the selectable property and configure the ezEditTable configuration object (ezEditTable_config). This demo shows how to :

Instructions: Double-click on a row on or press Enter key to perform action. Enable multiple rows selection by checking the Multiple selection checkbox. Keep Ctrl or Shift key pressed to select multiple rows.

Id Name Email Start Date Salary Active
29559Employee name...aemployee@email.com2011-01-010.00
29558Employee name...employee@email.com2011-01-010.00
29551Employee name...employee@email.com2011-01-010.00
29550Name khonamekho@email.com2011-01-010.00
29546ADSADAemployee@email.com2011-01-010.00
29545asdemployee@email.com2011-01-010.00
29541Ramon Melgarejo tasdf adsframon.melgarejo@mail.com2011-01-014500000.00
29539Employee name...HEHEH@HEHEHE.COM2011-01-010.00
29536Employee name...employee@email.com2011-01-010.00
29535Employee name...employee@email.com2011-01-010.00
29533Employee name...employee@email.com2011-01-010.00
29531Employee name...employee@email.com2011-01-010.00
29530Employee name...employee@email.com2011-01-010.00
29529Employee name...employee@email.com2011-01-010.00
29528Employee name...employee@email.com2011-01-010.00
29527Employee name...employee@email.com2011-01-010.00
29526Employee name...employee@email.com2011-01-010.00
29525Employee name...employee@email.com2011-01-010.00
29524Employee name...employee@email.com2011-01-010.00
29523Employee name...employee@email.com2011-01-010.00
29522Employee name...employee@email.com2011-01-010.00
29521Employee name...employee@email.com2011-01-010.00
29520Employee name...employee@email.com2011-01-010.00
29519Employee name...employee@email.com2011-01-010.00
29518Employee name...employee@email.com2011-01-010.00
29517Employee name...employee@email.com2011-01-010.00
29516Employee name...employee@email.com2011-01-010.00
29515Employee name...employee@email.com2011-01-010.00
29514Employee name...employee@email.com2011-01-010.00
29513Employee name...employee@email.com2011-01-010.00
29512Employee name...employee@email.com2011-01-010.00
29511Employee name...employee@email.com2011-01-010.00
29510Employee name...employee@email.com2011-01-010.00
29509Employee name...employee@email.com2011-01-010.00
29508Employee name...employee@email.com2011-01-010.00
29507Employee name...employee@email.com2011-01-010.00
29506opkopkpoemployee@email.com2011-01-010.00
29505Employee name...employee@email.com2011-01-010.00
29504Employee name...employee@email.com2011-01-010.00
29503Employee name...employee@email.com2011-01-010.00
29502Employee name...employee@email.com2011-01-010.00
29501Employee name...employee@email.com2011-01-010.00
29500Employee name...employee@email.com2011-01-010.00
29499Employee name...employee@email.com2011-01-010.00
29498Employee name...employee@email.com2011-01-010.00
29497Employee name...employee@email.com2011-01-010.00
29496Employee name...employee@email.com2011-01-010.00
29495Employee name...employee@email.com2011-01-010.00
29494Employee name...employee@email.com2011-01-010.00
29493Employee name...employee@email.com2011-01-010.00
29492Employee name...employee@email.com2011-01-010.00
29491Employee name...employee@email.com2011-01-010.00
29490Employee name...employee@email.com2011-01-010.00
29489Employee name...employee@email.com2011-01-010.00
29488Employee name...employee@email.com2011-01-010.00
29487Employee name...employee@email.com2011-01-010.00
29486Employee name...employee@email.com2011-01-010.00
29485Employee name...employee@email.com2011-01-010.00
29484Employee name...employee@email.com2011-01-010.00
29483Employee name...employee@email.com2011-01-010.00
29482Employee name...employee@email.com2011-01-010.00
29481Employee name...employee@email.com2011-01-010.00
29480Employee name...employee@email.com2011-01-010.00
29479Employee name...employee@email.com2011-01-010.00
29478Employee name...employee@email.com2011-01-010.00
29477dasdsad a dasemployee@email.com2011-01-010.00
29476sdfsdfsdffsdemployee@email.com2011-01-010.00
29475sdfsdfsdffsdemployee@email.com2011-01-010.00
29474Employee name...employee@email.com2011-01-010.00
29473sdfsdfsdffsdemployee@email.com2011-01-010.00
29472Employee name...employee@email.com2011-01-010.00
29471sdfsdfsdffsdemployee@email.com2011-01-010.00
29468blurghblurgh@asdf.com2011-01-010.00
29467hjtyjytjty@email.com2011-01-010.00
29466Nome do empregado...employee@email.com2011-01-010.00
29463Nome do empregado...employee@email.com2011-01-010.00
29462Employee name...employee@email.com2011-01-010.00
29458sdfsdfs s ssdfemployee@email.com2011-01-010.00
29457sdadsadasdemployee@email.com2011-01-010.00
29455eeeemployee@email.com2011-01-010.00
29452Employee name...employee@email.com2011-01-010.00
29450Employee name...employee@email.com2011-01-010.00
29448Employee name...employee@email.com2011-01-010.00
29447semployee@email.com2011-01-010.00
29446ssaemployee@email.com2011-01-010.00
29444Employee name...employee@email.com2011-01-010.00
29443Employee name...employee@email.com2011-01-010.00
29442Employee name...employee@email.com2011-01-010.00
29441oioioemployee@email.com2011-01-010.00
29440Employee name...employee@email.com2011-01-010.00
29439Employee name...employee@email.com2011-01-010.00
29438Employee name...employee@email.com2011-01-010.00
29437Employee name...employee@email.com2011-01-010.00
29436Employee name...employee@email.com2011-01-010.00
2943574employee@email.com2011-01-010.00
29434Employee name...employee@email.com2011-01-010.00
29433Employee name...employee@email.com2011-01-010.00
29432Employee name...employee@email.com2011-01-010.00
29431Employee name...employee@email.com2011-01-010.00
29430Employee name...employee@email.com2011-01-010.00
		var tfConfig = {
			btn_reset: true,
			alternate_rows: true,
			rows_counter: true,
			col_0: 'none', col_5: 'none',
			col_width:['40px', '280px', '220px', '100px', '100px', '70px'],
			col_date_type: [null,null,null,'ymd',null,null],
			sort_config: { sort_types: ['number','string','string','ymd','number','none'] },
			grid_layout: true, grid_width: '860px', grid_height: '400px',
			enable_default_theme: true,
			
			selectable: true,
			editable: false,
			ezEditTable_config: {
				default_selection: 'both',
				selected_row_css: 'ezSlcRow',
				on_validate_row: function(o, row){
					var id = o.Selection.GetActiveRowValues()[0];
					var employee = o.Selection.GetActiveRowValues()[1];
					alert('You have chosen record: '+ id +'\n'+employee+'\'s employee data');
				}
			}
		};
		

E.n.j.o.y.  ads-free content!