日期:2014-05-16 浏览次数:20382 次
Ext.onReady(function(){ //使用EditGrid // 1.开始使用使用editGrid // 1>把原来的Ext.grid.gridPanel修改成Ext.grid.editorGridPanel // 2>在grid中增加clicksToEdit参数,使其可编缉,不指定则默认为2.双击两次 // 3>定义form域中的组件进行编缉,如TextField // 4>在grid的columns中定义上步定义好的form域的组件. // 2.编缉更多的类型 // 1>时间 DateField // 2>下拉框 ComboBox // 3.脏数据的处理方法 // 1>使用afterEdit方法中参数 e.对于e的参数可以是field,value,grid,row,orignalValue,record,column // 2>使用e.record.commit()和e.record.reject()分别用来提交和拒绝数据,提交后把数据写入缓存中. // 4.缓存中数据的增加,修除方法. // 1>增加数据,定义数据类型 record.create定义数据类型,grid.getStore().insert增加数据,grid.startEidt开如编缉处 // 2>删除数据 grid.getStore().remove(sl)删除选中数据 // 5.服务端操作数据 // 1>对数据的增加,删除,修改操作,都可以用new Ext.data.Connection(); 类来与后台数据交互 // 2>与前台操作数据相同,不同的只是在操作时,把后台要操作的数据传到后台数据操作. // 3>返回success,与failture对成功与失败返回操作 //定义数据库 var store = new Ext.data.Store({ //定义数据 data data:[[ "de.png", 1, "Office Space", "Mike Judge", "1999-02-19", 1, "Work Sucks", "19.95", 1 ],[ "us.png", 3, "Super Troopers", "Jay Chandrasekhar", "2002-02-15", 2, "Altered State Police", "14.95", 2 ] ], reader:new Ext.data.ArrayReader({ id:"id" },[ 'image', 'id', 'title', 'director', {name: 'released', type: 'date', dateFormat: 'Y-m-d'}, 'genre', 'tagline', 'price', 'available' ] ) }); //定义form中组件,设置导演,标题,说明 var txtDirector = new Ext.form.TextField(); var txtTitle = new Ext.form.TextField(); var txtTagLine = new Ext.form.TextField({maxLength:45}); //发布日期 var dtReleased = new Ext.form.DateField({format:"m/d/y"}); //下拉框类型 var localData = [["1","喜剧"],["2","歌剧"],["3","动作片"]]; var localStore = new Ext.data.SimpleStore({ data:localData, fields:["id","type"] }); //类型 var cbGenre = new Ext.form.ComboBox({ store:localStore, typeAhead:true, mode:"local", displayField:'type', valueField:"id", triggerAction:"all" }); //定义数据类型 // 'image', // 'id', // 'title', // 'director', // {name: 'released', type: 'date', dateFormat: 'Y-m-d'}, // 'genre', // 'tagline', // 'price', // 'available' //定义编缉器 var editGrid = new Ext.grid.EditorGridPanel({ title:"电影编缉", frame:true, width:600, height:400, renderTo:document.body, clickstoEdit:2, store:store, sm:new Ext.grid.RowSelectionModel({ singleSelect:true }), columns:[{ header:"title", dataIndex:"title", editor:txtTitle },{ header:"director", dataIndex:"director", editor:txtDirector },{ header:"released", dataIndex:"released", renderer:Ext.util.Format.dateRenderer("m/d/y"), editor:dtReleased },{ header:"genre", dataIndex:"genre", renderer:function(val){ return localStore.queryBy(function(rec){ return rec.get("id") == val },this).itemAt(0).get("type"); }, editor:cbGenre },{ header:"tagline", dataIndex:"tagline", editor:txtTagLine } ], listeners:{ afterEdit:function(e){ //e.field && e.value 取当前的值 if(e.field == "director" && e.value == "refurbish"){ Ext.Msg.alert("refurbish is fobidden","被禁止"); e.record.reject(); }else{ //e.record.commit(); } //edit grid on server testGrid.updateFromServer(e); } }, tbar:[