ext行编辑和多行操作

来源:互联网 发布:tumblr视频下载软件 编辑:程序博客网 时间:2024/05/21 09:33

<textarea cols="89" rows="15" name="code" class="java">&lt;mce:script type="text/javascript"&gt;&lt;!--var ds,sm,gridlist,cm,isload = false;load(function(){ //初始化信息提示功能 Ext.QuickTips.init(); //统一指定错误信息提示浮动显示方式 Ext.form.Field.prototype.msgTarget = 'side'; sm = new Ext.grid.CheckboxSelectionModel(); var record = new Ext.data.Record.create([ 'fentryid', //内部编码 'fid', //企业编码(外键) 'fname', //人员名称 'fgw', //岗位、职称 'fphone', //联系电话 'fax', //传真 'fzh' //证号 ])ds = new Ext.data.Store({baseParams: {'enterpriseId':'${enterpriseId}'}, proxy: new Ext.data.HttpProxy({ url: '/baseinfo/enterprise.html?method=getListByEEMPerson' }), reader: new Ext.data.JsonReader({ root: 'list', totalProperty: 'totalCount' }, record)}); var fm = Ext.form; // 格式化日期显示 function formatDate(value){ return value ? value.dateFormat('Y, M d') : ''; } // 格式化性别显示,这是个 renderer, 渲染器 function formatSex(value) { return value ? "男" : "女"; } //editor 此属性为可编辑var cm = new Ext.grid.ColumnModel([ new Ext.grid.RowNumberer(),new Ext.grid.CheckboxSelectionModel(),{header: "内部编码", dataIndex: 'fentryid',width:0.1,align:'left'}, //隐藏不显示{header: "人员名称", dataIndex: 'fname',width:100,align:'left',editor: new fm.TextField({ selectOnFocus:true, //得到焦点自动选择文本 allowBlank:false, //不允许为空 blankText:'人员名称不可为空', //空验证失败错误提示信息 maxLength:20 }) },{header: "岗位职称", dataIndex: 'fgw',width:130,align:'left', editor: new fm.TextField({ allowBlank: true,// 能为空 maxLength:80 }) },{header: "联系电话", dataIndex: 'fphone',width:100,align:'left', //editor: new fm.NumberField({ editor: new fm.TextField({ selectOnFocus:true, //得到焦点自动选择文本 allowBlank: true, // 能为空 //allowNegative: false, regex : /^1/d{10}$|^(0/d{2,3}-?|/(0/d{2,3}/))?[1-9]/d{4,7}(-/d{1,8})?$/, regexText : '电话格式输入错误!正确格式如:123-1234567,123-12345678,1234-1234567,1234-12345678,也可以将&ldquo;-&rdquo;去掉。移动电话格式为:12345678901', maxLength: 80 }) },{header: "传真", dataIndex: 'fax',width:120,align:'left', //editor: new fm.NumberField({ editor: new fm.TextField({ selectOnFocus:true,//得到焦点自动选择文本 allowBlank: true, // 能为空 //allowNegative: false, regex :/^(/d{3,4})/-{0,1}(/d{7,8})$/, //, regexText : '传真格式输入错误!正确格式如:123-1234567,123-12345678,1234-1234567,1234-12345678,也可以将"-"去掉。', maxLength: 80 }) },{header: "证号", dataIndex: 'fzh',width:120,align:'left', //editor: new fm.NumberField({ editor: new fm.TextField({ selectOnFocus:true,//得到焦点自动选择文本 allowBlank: true, // 能为空 //allowNegative: false, regex :/^/w+$/ , //, regexText : '证号只允许输入字母和数字', maxLength: 80 }) } ]);gridlist = new Ext.grid.EditorGridPanel({ store: ds, cm: cm, sm:sm, el:'list', title:'企业能管人员添加列表', //stripeRows: true,//autoExpandColumn:'name', //可以让指定列的宽度自动伸展 width:'100%', height:310, clicksToEdit:1,//设置点击几次才可编辑 selModel: new Ext.grid.RowSelectionModel({singleSelect:false}),//设置单行选中模式, 否则将无法删除数据 bbar: new Ext.PagingToolbar({ pageSize: 12, store: ds, displayInfo: true, displayMsg: '当前显示 {0} - {1}条记录 /共 {2}条记录', emptyMsg: "没有数据显示" }), tbar: [ //新增 { text: '新增', iconCls:'addicon',//按钮图标的CSS名称 handler : function(){// 点击按钮执行的操作 var n = gridlist.getStore().getCount();// 获得总行数 var p = new record({ fentryid:'', fname: '', fgw: '', fphone: '', fax: '', fzh: '' }); gridlist.stopEditing();// 停止编辑 ds.insert(n, p);// 插入到最后一行 gridlist.startEditing(n, 1);// 开始编辑1单元格 } },//删除{ text: '删除', iconCls:'delicon', handler : function(){ //var record = grid.getSelectionModel().getSelected();// 返回值为 Record 类型 var rows = gridlist.getSelectionModel().getSelections();// 返回值为 Record 数组 if(rows.length==0){ Ext.MessageBox.alert('警告', '最少选择一条信息,进行删除!'); }else{ Ext.MessageBox.confirm('提示框', '您确定要进行该操作?',function(btn){ if(btn=='yes'){ if(rows){ var idArr = [];for (var i = 0; i &lt; rows.length; i++) { //alert(rows[i].get("fentryid")); if(rows[i].get('fentryid')!='') idArr.push(rows[i].get('fentryid'));ds.remove(rows[i]); //ds.removeAll(); //删除所有数据 } saveObj('/baseinfo/enterprise.html?method=deleteEEMPerson&amp;idArr='+idArr); } } }); } // 弹出对话框警告 } }, //保存 { text: '保存', iconCls: 'saveicon', handler : function(){ //var recordtoedit = gridlist.getSelectionModel().getSelected();// 返回值为 Record 类型 var records = gridlist.getSelectionModel().getSelections();// 返回值为 Record 数组 //var records = ds.getModifiedRecords() ;if(records.length==0){ Ext.MessageBox.alert('警告', '无修改记录可进行保存!'); }else{ var objArr = [];var fnameArr = [];var fgwArr = [];for (var i = 0; i &lt; records.length; i++) { var arr = [] arr.push(records[i].get("fentryid")=='' ? ' ':records[i].get("fentryid"));arr.push(records[i].get("fname")=='' ? ' ':records[i].get("fname"));arr.push(records[i].get("fgw")=='' ? ' ':records[i].get("fgw"));arr.push(records[i].get("fphone")=='' ? ' ':records[i].get("fphone"));arr.push(records[i].get("fax")=='' ? ' ':records[i].get("fax"));arr.push(records[i].get("fzh")=='' ? ' ':records[i].get("fzh")); objArr.push(arr.join(";"));} var url = '/baseinfo/enterprise.html?method=saveEEMPerson&amp;objArr='+objArr+"&amp;enterpriseId="+'${enterpriseId}';saveObj(url);} } }, //关闭 { text: '关闭', iconCls: 'closeicon', handler : function(){ closeEdit(); } } ] });gridlist.render();ds.addListener('datachanged',function(){if(isload)filtergrid();})ds.load({callback:function(recode,options,success){if(success){//filtergrid();isload = success;}}, params:{start:0,limit:120}}); //修改记录后触发的事件//gridlist.on("afteredit", afterEdit, gridlist);})function afterEdit(obj){ //var r = obj.record; //var id = r.get("fname");//var t = ds.getModifiedRecords() ; //alert(t[0].get("fname"));} function filtergrid(){}//删除跟提交修改记录到后台处理,及返回function saveObj(url){ Ext.Ajax.request({url : url,success: function(response){var result = response.responseText;if(result == 'true'){parent.Example.showMsg('操作成功','success.gif');//ds.load({params:{start:0, limit:pageSize}});}else{parent.Example.showAlert('操作失败','dialog-error.png');//ds.load({params:{start:0, limit:pageSize}});}ds.load({params:{start:0,limit:120}});}})}// --&gt;&lt;/mce:script&gt;</textarea>

 

 

  <div class="edit-fieldset-center">
   <input type='hidden' id='url' value=''/>
   <div style="border: 1px solid #c3daf9;margin-top:10px;height:80%" id='list'>
   </div>
  </div>

 

-----在tbar中  按钮靠右的属性 '->',