首页 > 代码库 > EasyUI,子从表模式,进行数据编辑
EasyUI,子从表模式,进行数据编辑
在edit.js文件中,对数据列开启编辑状态,提交时关闭编辑状态,并验证所填数据是否正确。
$(function() { examplegrid = $("#grid").datagrid({ url : ‘data/detailData.do‘, showFooter : true, border : false, fit : true, fitColumns : false, nowrap : true, rownumbers : true, singleSelect : false, frozenColumns : [ [ { field : "ck", width : 50, checkbox : true }, { title : "操作", field : "action", width : 80, halign : "center", align : "center", formatter : formatAction } ] ], columns : [ [ { title : "姓名", field : "name", width : 110, halign : "center", align : "center", sortable : true, editor : { type : ‘text‘ } }, { title : "年龄", field : "age", width : 110, halign : "center", align : "center", sortable : true, editor : { type : ‘text‘ } } ] ], onBeforeEdit : function(index, row) { row.editing = true;// 标识是否编辑 examplegrid.datagrid(‘refreshRow‘, index);// 将上面的标识写入行数据中 }, onAfterEdit : function(index, row) { row.editing = false; examplegrid.datagrid(‘refreshRow‘, index); }, onCancelEdit : function(index, row) { row.editing = false; examplegrid.datagrid(‘refreshRow‘, index); }, onClickRow : function(rowIndex, rowData) { editrow_Index(rowIndex); } }); $(‘#form‘).form({ url : ‘data/detailadd.do‘, onSubmit : function() { parent.$.messager.progress({ title : ‘提示‘, text : ‘数据处理中,请稍后....‘ }); var isValid = $(‘#form‘).form(‘validate‘); if (!isValid) { parent.$.messager.progress(‘close‘); return false; } var rows = xbticketgrid.datagrid(‘getRows‘); if (rows && rows.length > 0) { var gridValid = ticketendEdit();// // 退出编辑并验证必填信息是否填写 if (gridValid != 0) { parent.$.messager.progress(‘close‘); parent.$.messager.alert(‘错误‘, "第" + gridValid + "行的填写不正确"); beginEdit(); return false; } return true; } else { parent.$.messager.progress(‘close‘); parent.$.messager.alert(‘错误‘, "请先添加个人信息后再保存"); return false; } }, success : function(result) { parent.$.messager.progress(‘close‘); try { data = eval("(" + result + ")");// 将JSON字符串转换成对象 if (data && data.success) { if (data.msg && data.msg != "") parent.$.messager.alert(‘提示‘, data.msg); else parent.$.messager.alert(‘提示‘, "添加成功"); parent.$.modalDialog.openner_grid.datagrid(‘reload‘);// 刷新Gird数据 parent.$.modalDialog.handler.dialog(‘close‘);// 关闭当前模式窗口 } else parent.$.messager.alert(‘错误‘, data.msg);// 操作失败 } catch (e) { } } }); }); // 操作列格式化 function formatAction(value, row, index) { if (row.editing) { var s = ‘<a href="javascript:void(0);" onclick="saverow(this)">确认</a> ‘; var c = ‘<a href="javascript:void(0);" onclick="cancelrow(this)">取消</a>‘; return s + c; } else { var e = ‘<a href="javascript:void(0);" onclick="editrow(this)">修改</a> ‘; return e; } } // 编辑单行 function editrow(target) { var index = getRowIndex(target); examplegrid.datagrid(‘beginEdit‘, index); } // 编辑单行 function editrow_Index(index) { examplegrid.datagrid(‘beginEdit‘, index); editIndex_invit = index; } // 保存单行 function saverow(target) { var index = getRowIndex(target); examplegrid.datagrid(‘endEdit‘, index); } // 取消编辑 function cancelrow(target) { var index = getRowIndex(target); examplegrid.datagrid(‘cancelEdit‘, index); } // 从tr上获取行号 function getRowIndex(target) { var tr = $(target).closest(‘tr.datagrid-row‘); return parseInt(tr.attr(‘datagrid-row-index‘)); } // 先验证编辑行中的数据,无错误后,退出所有的编辑模式 function ticketendEdit() { var validate = 0;// 记录没有填写数量的行 var rows = xbticketgrid.datagrid(‘getRows‘); try { for ( var i = 0; i < rows.length; i++) { if (xbticketgrid.datagrid(‘validateRow‘, i)) { xbticketgrid.datagrid(‘endEdit‘, i); } else { validate = i + 1;// 行号 } } } catch (e) { } return validate;// 返回false表示有错误无法退出编辑模式 } // 开启编辑 function beginEdit() { var rows = examplegrid.datagrid(‘getRows‘); try { for ( var i = 0; i < rows.length; i++) { examplegrid.datagrid(‘beginEdit‘, i); } } catch (e) { } }
EasyUI,子从表模式,进行数据编辑
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。