EXT EditorGridPanel 中用复选框表示真假值,扩展官方示例

核心提示： 但是问题又来了.我们点击修改值而后台却不被更新,所以我们要对onMouseDown修改一下. Js代码onMouseDown:function(e,t){if(t.className&&t.className.indexOf('x-grid3-cc-'+this.id)!=-1)

但是问题又来了.我们点击修改值而后台却不被更新,所以我们要对onMouseDown修改一下.

Js代码　　　

onMouseDown　:　function(e,　t)　{　
　if　(t.className　&&　t.className.indexOf('x-grid3-cc-'　+　this.id)　!=　-1)　{　
　　e.stopEvent();　
　　var　index　=　this.grid.getView().findRowIndex(t);　
　　var　cindex　=　this.grid.getView().findCellIndex(t);　
　　var　record　=　this.grid.store.getAt(index);　
　　var　field　=　this.grid.colModel.getDataIndex(cindex);　
　　var　e　=　{　
　　grid　:　this.grid,　
　　record　:　record,　
　　field　:　field,　
　　originalValue　:　record.data[this.dataIndex],　
　　value　:　!record.data[this.dataIndex],　
　　row　:　index,　
　　column　:　cindex,　
　　cancel　:　false　
　　};　
　　if　(this.grid.fireEvent("validateedit",　e)　!==　false　&&　!e.cancel)　{　
　　delete　e.cancel;　
　　record.set(this.dataIndex,　!record.data[this.dataIndex]);　
　　this.grid.fireEvent("afteredit",　e);　
　　}　
　}　
　}　

这样当我们的afteredit被触发后就会执行我们事先设定好的程序,调用业务逻辑修改后台数据.

下面是EditorGridPanel的处理代码

Js代码　　　

//其他代码省略,这里是grid的listeners属性的配置代码　
　
listeners　:　{　
　'afteredit'　:　function(e)　{　
　　Ext.Ajax.request({　
　　url　:　'updateUser.action',　
　　params　:　{　
　　　filedName　:　e.field,　
　　　fieldValue　:　e.value,　
　　　userId　:　e.record.data.userId　
　　},　
　　success　:　function()　{　
　　　//alert('ok');　
　　},　
　　failure　:　function()　{　
　　　Ext.Msg.show({　
　　　title　:　'错误提示',　
　　　msg　:　'修改数据发生错误,操作将被回滚!',　
　　　fn　:　function()　{　
　　　　e.record.set(e.field,　e.originalValue);　
　　　},　
　　　buttons　:　Ext.Msg.OK,　
　　　icon　:　Ext.Msg.ERROR　
　　　});　
　　}　
　　});　
　}　
　}