首页 > 代码库 > jquery easyui-datagrid手动增加删除重置行
jquery easyui-datagrid手动增加删除重置行
1.实现的效果图如下
2.界面：
<div region="center">
<table id="tt">
</table>
</div>
3.引入的js文件
<link rel="stylesheet" type="text/css" href="http://www.cnblogs.com/script/themes/default/easyui.css" />
<link rel="stylesheet" type="text/css" href="http://www.cnblogs.com/script/themes/icon.css" />
<script type="text/javascript" src="http://www.cnblogs.com/script/jquery-1.4.2.min.js" </script>
<script type="text/javascript" src="http://www.cnblogs.com/script/jquery.easyui.min.js" </script>
<script type="text/javascript" src="http://www.cnblogs.com/script/locale/easyui-lang-zh_CN.js" mce_src="http://www.mamicode.com/script/locale/easyui-lang-zh_CN.js"></script>
4.实现的js代码：
<script type="text/javascript"> var id; $(document).ready(function () { //初始化所在城区 var dialogParams = window.dialogArguments; var obj = dialogParams[0]; var xmaqryPartJson = obj[‘xmaqryPartJson‘]; $("[id^=gfzrzt_]").each(function(){ document.getElementById($(this).attr("id")).value = http://www.mamicode.com/obj[$(this).attr("id").replace("gfzrzt_","")] }) id = obj[‘id‘]; initData(xmaqryPartJson) }); function initData(xmaqJson) { if (xmaqJson == ‘‘ || xmaqJson == undefined || xmaqJson == null) { showTable(new Array()); } else { var data = http://www.mamicode.com/$.parseJSON(xmaqJson);"#tt").datagrid({ idField: "id", fitColumns: false, title: "项目专职安全生产管理人员", singleSelect: true, frozenColumns: [[ { field: ‘id‘, checkbox: true } ]], columns: [ [ {field: ‘zrztid‘, align: "center", width: 0}, {field: ‘gcid‘,hidden: true, align: "center", width: 0}, {field: ‘gccode‘, align: "center", width: 0}, {field: ‘zzid‘,hidden: true, align: "center", width: 0}, {field: ‘zzsj‘, align: "center", width: 0}, {field: ‘xm‘, title: ‘姓名‘, width: 130, sortable: true, align: ‘center‘,required:true, editor: {type:‘text‘}}, {field: ‘aqsckhzh‘, title: ‘安全生产考核证号‘, width: 150, sortable: true, align: ‘center‘, editor: ‘text‘}, {field: ‘lxdh‘, title: ‘联系电话‘, width: 100, sortable: true, align: ‘center‘, editor: ‘text‘} ] ], toolbar: [{ text: ‘添加‘, iconCls: ‘icon-add‘, handler: function () { if (endEditing()){ $(‘#tt‘).datagrid(‘appendRow‘,{row: { id:‘‘,zrztid:id,gcid:‘‘, gccode: ‘‘, zzid: ‘‘, zzsj: ‘‘, xm:‘‘, aqsckhzh: ‘‘, lxdh:‘‘ }}); if($(‘#tt‘).datagrid(‘getRows‘) != undefined){ lastIndex = $(‘#tt‘).datagrid(‘getRows‘).length-1; } $(‘#tt‘).datagrid(‘selectRow‘, lastIndex) .datagrid(‘beginEdit‘, lastIndex) } } }, ‘-‘, { text: ‘删除‘, iconCls: ‘icon-remove‘, handler: function () { var row = $(‘#tt‘).datagrid(‘getSelected‘); if (row) { var index = $(‘#tt‘).datagrid(‘getRowIndex‘, row); $(‘#tt‘).datagrid(‘cancelEdit‘, index).datagrid(‘deleteRow‘, index); lastIndex = undefined; } } }// ,‘-‘, {// text: ‘保存‘,// iconCls: ‘icon-save‘,// handler: function () {// if (endEditing()){// $(‘#tt‘).datagrid(‘acceptChanges‘);// }// }// } , ‘-‘, { text: ‘重置‘, iconCls: ‘icon-undo‘, handler: function () { $(‘#tt‘).datagrid(‘rejectChanges‘); lastIndex = undefined; } }] , onClickRow: function (index){ if (lastIndex != index){ if (endEditing()){ $(‘#tt‘).datagrid(‘selectRow‘, index) .datagrid(‘beginEdit‘, index); lastIndex = index; } else { $(‘#tt‘).datagrid(‘selectRow‘, lastIndex); } } } }); $("#tt").datagrid("loadData", xmaqJson); } function endEditing(){ if (lastIndex == undefined){return true} if ($(‘#tt‘).datagrid(‘validateRow‘, lastIndex)){ var ed = $(‘#tt‘).datagrid(‘getEditor‘, {index:lastIndex,field:‘xm‘}); var xm = $(ed.target).val(); var ed1 = $(‘#tt‘).datagrid(‘getEditor‘, {index:lastIndex,field:‘aqsckhzh‘}); var aqsckhzh = $(ed1.target).val(); if(xm != ‘‘ && xm != undefined && aqsckhzh !=‘‘ && aqsckhzh != undefined){ $(‘#tt‘).datagrid(‘endEdit‘, lastIndex); lastIndex = undefined; return true; }else{ alert("项目专职安全生产管理人员第"+(lastIndex+1)+"行【姓名】和【安全生产考核】必须填写"); return false; } } else { return false; } }</script>jquery easyui-datagrid手动增加删除重置行
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。