If you want to edit the table, you need to complete the following three steps
1. Set the column in columns that you want to edit to editor and provide the control you want to use when editing the column.
2. Instantiate the subclass of the plug-in class, a column editor object, before Gridpanel renders.
3. Bind the Column Editor object to the Gridpanel.
4. Indicate that the selection mode for Gridpanel is column selection mode.
The following is only the key code for configuring the Edit column, as follows:
varcolumns =[{header:' Number ', Dataindex: ' ID '}, {header:Gender, Dataindex:' Name ', Editor: {xtype:"ComboBox",//Xtype represents the instantiation of a component or control object, which is equivalent to new Ext.form.combobox () and the object name is all lowercase. Allowblank:false//null values are not allowed}}, {header:' Description ', dataindex: ' DESCN ', Editor: {xtype:"TextField", Allowblank:false,//null values are not allowedSelectonfocus:true//The value is automatically checked when you click Edit to remove the user. } }];//new A column editor plug-invarCellediting =NewExt.grid.plugin.CellEditing ({clickstoedit:0//Set to 0 o'clock, double-click the column to put the column into edit state, 1 o'clock click the column to make the column edit. });varGrid =NewExt.grid.GridPanel ({renderto:' Box ', Store:store, Columns:columns, SelType:' Rowmodel ',//indicates selection mode for columnplugins:[//Binding Column Editor plug-incellediting]});
Javascript-Learning Total Directory
Javascript-extjs-gridpanel Components-Edit