<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta name="renderer" content="webkit|ie-comp|ie-stand"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" /> <meta http-equiv="Cache-Control" content="no-siteapp" /> <!--[if lt IE 9]> <script type="text/javascript" src="${ctx}/assets/lib/html5.js"></script> <script type="text/javascript" src="${ctx}/assets/lib/respond.min.js"></script> <script type="text/javascript" src="${ctx}/assets/lib/PIE_IE678.js"></script> <![endif]--> <link rel="stylesheet" type="text/css" href="${ctx}/assets/static/h-ui/css/H-ui.min.css" /> <link rel="stylesheet" type="text/css" href="${ctx}/assets/static/h-ui.admin/css/H-ui.admin.css" /> <link rel="stylesheet" type="text/css" href="${ctx}/assets/lib/Hui-iconfont/1.0.7/iconfont.css" /> <link rel="stylesheet" type="text/css" href="${ctx}/assets/lib/icheck/icheck.css" /> <link rel="stylesheet" type="text/css" href="${ctx}/assets/static/h-ui.admin/skin/default/skin.css" id="skin" /> <link rel="stylesheet" type="text/css" href="${ctx}/assets/static/h-ui.admin/css/style.css" /> <script type="text/ecmascript" src="${ctx}/assets/lib/jquery/1.9.1/jquery.js"></script> <script type="text/javascript" src="${ctx}/assets/static/h-ui/js/H-ui.js"></script> <script type="text/javascript" src="${ctx}/assets/lib/layer/3.0.3/layer.js"></script> <link rel="stylesheet" type="text/css" media="screen" href="${ctx}/assets/lib/jqueryui/jquery-ui.css" /> <link rel="stylesheet" type="text/css" media="screen" href="${ctx}/assets/lib/jqgrid/css/ui.jqgrid.css" /> <script type="text/ecmascript" src="${ctx}/assets/lib/jqueryui/jquery-ui.js"></script> <script type="text/ecmascript" src="${ctx}/assets/lib/jqgrid/js/i18n/grid.locale-cn.js"></script> <script type="text/ecmascript" src="${ctx}/assets/lib/jqgrid/js/jquery.jqGrid.min.js"></script> <script type="text/javascript" src="${ctx}/assets/js/base.js"></script> <!--[if IE 6]> <script type="text/javascript" src="${ctx}/assets/lib/DD_belatedPNG_0.0.8a-min.js" ></script> <script>DD_belatedPNG.fix('*');</script> <![endif]--> <script type="text/javascript"> $(function() { $(window).resize(function(){ $("#jqGrid").setGridWidth($(window).width()-40); }); $("#jqGrid").jqGrid({ url : '${ctx}/myconsole/frangmentArea/getByPage', editurl:"${ctx}/myconsole/frangmentArea/saveOrUpdate2", mtype : "POST", datatype : "json", prmNames:{id:"keyid"}, caption:'区域管理', colModel : [ { label : '任务编号', name : 'keyid', hidden : true, key : true, width : 50, }, { label : '区域编号', name : 'areaid', editable: false, width : 80 }, { label : '区域名称', name : 'areaname', editable: true, width : 80 }, { label : '区域描述', name : 'areadesc', editable: true, width : 80, edittype : "textarea", editoptions: { size:50, maxlength: 500, rows:"5", cols:"40" } }, { label : '模板文件', name : 'templatefile', editable: false, width : 80 }], rownumbers : true,//添加左侧行号 viewrecords : true,//是否在浏览导航栏显示记录总数 rowNum : 10,//每页显示记录数 rowList : [10,15,20,30,40,50 ],//用于改变显示行数的下拉列表框的元素数组。 autowidth : true, height : 'auto', onSelectRow : function( rowid ) { if(rowid.length>10){ var row = $(this).getRowData(rowid); $("#jqGridBind").setColProp('areakeyid',{editoptions:{value:rowid+":a"}}); $("#jqGridBind").setColProp('areaid',{editoptions:{value:row.areaid+":a"}}); $("#jqGridBind").setCaption("片段绑定--"+row.areaid); $("#jqGridBind").jqGrid('setGridParam',{url: "${ctx}/myconsole/fragmentBind/getByPage?areaKeyID="+rowid}); $("#jqGridBind").trigger("reloadGrid"); } }, pager : "#jqGridPager" }); $('#jqGrid').navGrid('#jqGridPager', // the buttons to appear on the toolbar of the grid { edit : true, add : false, del : false, search : true, refresh : true, view : true, position : "left", cloneToTop : true }, // options for the Edit Dialog { recreateForm : true, checkOnUpdate : true, checkOnSubmit : true, closeAfterEdit : true, onInitializeForm:function(formid) { }, serializeEditData: function(postdata) { //myconsole.log(postdata); $.each(postdata,function (index, value) { //myconsole.log(index); if(index!="jqGrid_id" && index!="oper" && index!="keyid"){ modifyJosnKey(postdata,index,"fragmentArea."+index); } if(index=="keyid"){ postdata["fragmentArea."+index]=value } }) //myconsole.log(postdata); return postdata; }, afterSubmit: function (response, postdata) { // console.log(response); var res=eval('(' + response.responseText + ')'); layer.msg(res.msg); return [res.state,res.msg,'']; }, errorTextFormat : function(data) { return 'Error: ' + data.responseText } }, // options for the Add Dialog { closeAfterAdd : true, recreateForm : true, beforeSubmit: function(postdata, formid){ $.each(postdata,function (index, value) { if(index!="jqGrid_id" && index!="oper"){ modifyJosnKey(postdata,index,"fragmentArea."+index); } }) return[true,'']; }, afterSubmit: function (response, postdata) { // console.log(response); var res=eval('(' + response.responseText + ')'); layer.msg(res.msg); return [res.state,res.msg,'']; }, errorTextFormat : function(data) { return 'Error: ' + data.responseText } }, // options for the Delete Dailog { errorTextFormat : function(data) { return 'Error: ' + data.responseText } },{ // search options 这里支持多条件查询 multipleSearch: true, sopt:['eq','ne','cn','nc','lt','le','gt','ge'], afterSubmit: function(r, data) { var messageString = r.responseText; var mesObj = eval('(' + messageString + ')'); return [mesObj.state, mesObj.message]; } } ); //区域绑定片段 $("#jqGridBind").jqGrid({ url : '${ctx}/myconsole/fragmentBind/getByPage', editurl:"${ctx}/myconsole/fragmentBind/saveOrUpdate2", mtype : "POST", datatype : "json", prmNames:{id:"keyid"}, caption:'绑定片段', sortname: 'sortid', sortorder: "asc", colModel : [ { label : '任务编号', name : 'keyid', hidden : true, key : true, width : 50, }, { label : '区域主键编号', name : 'areakeyid', hidden : true, editable : true, edittype :"select", editoptions:{value:"a:a"} }, { label : '区域编号', name : 'areaid', hidden : true, editable : true, edittype :"select", editoptions:{value:"a:a"} },{ label : '绑定片段实例', name : 'bindfragment', editable: true, formatter:"select", edittype: "select", editoptions: { value: "${fragmentInstances}" }, stype:"select", searchoptions:{ value: "${fragmentInstances}" }, formoptions:{ elmsuffix:'*' }, editrules:{required:true}, width : 80 }, { label : '排序值', name : 'sortid', editable: true, formoptions:{ elmsuffix:'*(整数)' }, editoptions: { maxlength: 15 }, editrules:{required:true,integer:true}, width : 80 }], rownumbers : true,//添加左侧行号 viewrecords : true,//是否在浏览导航栏显示记录总数 rowNum : 10,//每页显示记录数 rowList : [10,15,20,30,40,50 ],//用于改变显示行数的下拉列表框的元素数组。 autowidth : true, height : 'auto', pager : "#jqGridPagerBind" }); $('#jqGridBind').navGrid('#jqGridPagerBind', //the buttons to appear on the toolbar of the grid { edit : true, add : true, del : true, search : true, refresh : true, view : true, position : "left", cloneToTop : true }, //options for the Edit Dialog { recreateForm : true, checkOnUpdate : true, checkOnSubmit : true, closeAfterEdit : true, onInitializeForm:function(formid) { }, serializeEditData: function(postdata) { //myconsole.log(postdata); $.each(postdata,function (index, value) { //myconsole.log(index); if(index!="jqGrid_id" && index!="oper" && index!="keyid"){ modifyJosnKey(postdata,index,"fragmentBind."+index); } if(index=="keyid"){ postdata["fragmentBind."+index]=value } }) //myconsole.log(postdata); return postdata; }, afterSubmit: function (response, postdata) { // console.log(response); var res=eval('(' + response.responseText + ')'); layer.msg(res.msg); return [res.state,res.msg,'']; }, errorTextFormat : function(data) { return 'Error: ' + data.responseText } }, //options for the Add Dialog { closeAfterAdd : true, recreateForm : true, beforeSubmit: function(postdata, formid){ $.each(postdata,function (index, value) { if(index!="jqGrid_id" && index!="oper"){ modifyJosnKey(postdata,index,"fragmentBind."+index); } }) return[true,'']; }, afterSubmit: function (response, postdata) { var res=eval('(' + response.responseText + ')'); layer.msg(res.msg); //console.log(res); return [res.state,res.msg,'']; }, errorTextFormat : function(data) { return 'Error: ' + data.responseText } }, //options for the Delete Dailog { errorTextFormat : function(data) { return 'Error: ' + data.responseText } },{ // search options 这里支持多条件查询 multipleSearch: true, sopt:['eq','ne','cn','nc','lt','le','gt','ge'], afterSubmit: function(r, data) { var messageString = r.responseText; var mesObj = eval('(' + messageString + ')'); return [mesObj.state, mesObj.message]; } } ); $("#initArea").click(function(){ $.post("${ctx}/myconsole/frangmentArea/initArea",{},function(data){ layer.msg("完成读取模板区域"); $("#jqGrid").trigger("reloadGrid"); }) }) }) </script> <title>我的桌面</title> </head> <body> <div class="page-container"> <div style="text-align:right"> <button id="initArea" class="btn btn-primary radius" type="button"><i class="Hui-iconfont"></i>读取模板区域信息</button> </div> <table id="jqGrid"></table> <div id="jqGridPager"></div> <div> </div> <table id="jqGridBind"></table> <div id="jqGridPagerBind"></div> </div> <footer class="footer mt-20"> <div class="container"> <p></p> </div> </footer> </body> </html>