EditorGridPanel鏄疎xtJs涓殑涓€涓粍浠讹紝鐢ㄤ簬鏄剧ず鍙紪杈戠殑琛ㄦ牸鏁版嵁銆備娇鐢‥ditorGridPanel鐨勬楠ゅ涓嬶細

1. 瀵煎叆ExtJs搴撴枃浠讹細

<script src="ext-all.js"></script>

2. 鍒涘缓涓€涓猄tore鐢ㄤ簬瀛樺偍琛ㄦ牸鏁版嵁锛?/li>

var store = Ext.create('Ext.data.Store', {
fields: ['name', 'age', 'gender'],
data: [
{ name: 'Alice', age: 25, gender: 'Female' },
{ name: 'Bob', age: 30, gender: 'Male' },
{ name: 'Charlie', age: 35, gender: 'Male' }
]
});

3. 鍒涘缓涓€涓狢olumnModel瀹氫箟琛ㄦ牸鍒楃殑灞炴€э細

var columnModel = Ext.create('Ext.grid.column.Column', {
columns: [
{ header: 'Name', dataIndex: 'name', editor: 'textfield' },
{ header: 'Age', dataIndex: 'age', editor: 'numberfield' },
{ header: 'Gender', dataIndex: 'gender', editor: 'combobox' }
]
});

4. 鍒涘缓涓€涓狤ditorGridPanel骞舵寚瀹歋tore鍜孋olumnModel锛?/li>

var editorGridPanel = Ext.create('Ext.grid.Panel', {
store: store,
columns: columnModel,
selType: 'cellmodel',
plugins: [
Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1
})
],
renderTo: Ext.getBody()
});

5. 娓叉煋EditorGridPanel鍒伴〉闈笂锛?/li>

editorGridPanel.render(Ext.getBody());

閫氳繃浠ヤ笂姝ラ锛屽氨鍙互鍒涘缓涓€涓彲缂栬緫鐨勮〃鏍肩粍浠禘ditorGridPanel骞舵樉绀哄埌椤甸潰涓娿€備綘鍙互鏍规嵁瀹為檯闇€姹備慨鏀逛唬鐮佷腑鐨勬暟鎹拰鍒楀睘鎬с€?/p>