一个web系统权限需求(可管理设备和设备类型js实现代码)
<%@ page contentType="text/html;charset=UTF-8" language="java"><!-- Standard Content --><style type="text/css">.text-td-right { color: #000000; font-size: 80%; font-weight: bold; font-family: Verdana, Arial, Helvetica, sans-serif; text-align:right; padding: 3px;}</style><!-- Body --><%String deviceTypeResult = request.getAttribute("deviceTypeResult").toString();String deviceResult = request.getAttribute("deviceResult").toString();String personId = request.getAttribute("personId").toString();%><script type="text/javascript">function selectAll(allId,itemId,noAllId){document.getElementById(noAllId).checked=false;var obj = document.getElementById(allId);var objj = document.getElementsByName(itemId);if(obj.checked){for(var i=0; i<objj.length; i++){objj[i].checked = true;}}}function noSelectAll(allId,itemId,noAllId){document.getElementById(allId).checked=false;var obj = document.getElementById(noAllId);var objj = document.getElementsByName(itemId);if(obj.checked){for(var i=0; i<objj.length; i++){objj[i].checked = false;}}}function onload(){/*******加载设备类型********/var bindZequipValue = "<%=request.getAttribute("deviceTypeResult").toString() %>";if(bindZequipValue != ""){//deviceTypebindZequipValue = bindZequipValue.substring(0,bindZequipValue.length-1); //分割<br>生成table行 var tableArray = bindZequipValue.split("<br>"); var startTable = "<table width='100%' border='0' cellspacing='1' cellpadding='0'>"; var tr = ""; for(var i=0;i<tableArray.length;i++){ tr += "<tr>"; //分割;生成td var td = ""; var trArray = tableArray[i].split(";"); var jCount = 0; for(var j=0;j<trArray.length-1;j++){ //将复选框和复选框后面的内容进行分离生成两个Td var splitTd = trArray[j]; var td1 = splitTd.substring(0,splitTd.indexOf("/>")+2); var td2 = splitTd.substring(splitTd.indexOf("/>")+2,splitTd.length);td += "<td nowrap width='5%' align='center'><div class='table-text-bold-l'>"+td1+"</div></td><td nowrap width='20%' align='center'><div class='table-text-bold-l'>"+td2+"<div></td>";jCount++; } if(jCount==1){ td += "<td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td><td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td><td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td>"; }else if(jCount==2){ td += "<td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td><td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td>"; }else if(jCount==3){ td += "<td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td>"; } tr += td+"</tr>"; } var endTable = "</table>";document.getElementById("deviceType").innerHTML=startTable+tr+endTable;}/*******加载可管理的设备********/var bindValue = "<%=request.getAttribute("deviceResult").toString() %>";if(bindValue != ""){var checkValue = bindValue;//定义拼接换行显示tempValue var tempValue = ""; var array = checkValue.split(";"); for(var i=0;i<array.length;i++){ if((i+1)%4==0){ tempValue += array[i]+";<br>"; }else{ tempValue += array[i]+";"; } } tempValue = tempValue.substring(0,tempValue.length-1); //分割<br>生成table行 var tableArray = tempValue.split("<br>"); var startTable = "<table width='100%' border='0' cellspacing='1' cellpadding='0'>"; var tr = ""; for(var i=0;i<tableArray.length;i++){ tr += "<tr>"; //分割;生成td var td = ""; var trArray = tableArray[i].split(";"); var jCount = 0; for(var j=0;j<trArray.length-1;j++){ //将复选框和复选框后面的内容进行分离生成两个Td var splitTd = trArray[j]; var td1 = splitTd.substring(0,splitTd.indexOf("/>")+2); var td2 = splitTd.substring(splitTd.indexOf("/>")+2,splitTd.length);td += "<td nowrap width='5%' align='center'><div class='table-text-bold-l'>"+td1+"</div></td><td nowrap width='20%' align='center'><div class='table-text-bold-l'>"+td2+"<div></td>";jCount++; } if(jCount==1){ td += "<td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td><td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td><td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td>"; }else if(jCount==2){ td += "<td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td><td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td>"; }else if(jCount==3){ td += "<td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td>"; } tr += td+"</tr>"; } var endTable = "</table>";document.getElementById("manageDeviceDiv").style.display="block";document.getElementById("manageDevice").innerHTML=startTable+tr+endTable;document.getElementById("deviceHidden").value=bindValue;}}function postForm(){document.newPersonForm.submit();}function checkFunction(zequipId,zequips){//显示可管理的设备DIVdocument.getElementById("manageDeviceDiv").style.display="block";//获取设备类型CheckBoxvar obj = document.getElementById(zequips);//累计拼接选项var initManagerDevice = document.getElementById("deviceHidden").value;//如果获取的设备类型checkbox被选中，则显示可管理的设备，否则不显示可管理的设备if(obj.checked){Ext.Ajax.request({ url: '../personAction/bindCheckBoxDevice.do', params: {zequipId:zequipId,initManagerDevice:initManagerDevice,init:"true",personId:'<%=personId %>' }, method: 'post', success: function (response, options) { document.getElementById("manageDevice").innerHTML=""; document.getElementById("deviceHidden").value=response.responseText; var checkValue = response.responseText; //定义拼接换行显示tempValue var tempValue = ""; var array = checkValue.split(";"); for(var i=0;i<array.length;i++){ if((i+1)%4==0){ tempValue += array[i]+";<br>"; }else{ tempValue += array[i]+";"; } } tempValue = tempValue.substring(0,tempValue.length-1); //分割<br>生成table行 var tableArray = tempValue.split("<br>"); var startTable = "<table width='100%' border='0' cellspacing='1' cellpadding='0'>"; var tr = ""; for(var i=0;i<tableArray.length;i++){ tr += "<tr>"; //分割;生成td var td = ""; var trArray = tableArray[i].split(";"); var jCount = 0; for(var j=0;j<trArray.length-1;j++){ //将复选框和复选框后面的内容进行分离生成两个Td var splitTd = trArray[j]; var td1 = splitTd.substring(0,splitTd.indexOf("/>")+2); var td2 = splitTd.substring(splitTd.indexOf("/>")+2,splitTd.length); td += "<td nowrap width='5%' align='center'><div class='table-text-bold-l'>"+td1+"</div></td><td nowrap width='20%' align='center'><div class='table-text-bold-l'>"+td2+"<div></td>"; jCount++; } if(jCount==1){ td += "<td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td><td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td><td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td>"; }else if(jCount==2){ td += "<td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td><td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td>"; }else if(jCount==3){ td += "<td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td>"; } tr += td+"</tr>"; } var endTable = "</table>"; document.getElementById("manageDevice").innerHTML=startTable+tr+endTable; }, failure: function (response, options) { Ext.MessageBox.alert("失败", '请求超时!'); }});}else{Ext.Ajax.request({ url: '../personAction/bindCheckBoxDevice.do', params: {zequipId:zequipId,initManagerDevice:initManagerDevice,init:"false",personId:'<%=personId %>' }, method: 'post', success: function (response, options) { document.getElementById("manageDevice").innerHTML=""; document.getElementById("deviceHidden").value=response.responseText; var checkValue = response.responseText; //定义拼接换行显示tempValue var tempValue = ""; var array = checkValue.split(";"); for(var i=0;i<array.length;i++){ if((i+1)%4==0){ tempValue += array[i]+";<br>"; }else{ tempValue += array[i]+";"; } } tempValue = tempValue.substring(0,tempValue.length-1); //分割<br>生成table行 var tableArray = tempValue.split("<br>"); var startTable = "<table width='100%' border='0' cellspacing='1' cellpadding='0'>"; var tr = ""; for(var i=0;i<tableArray.length;i++){ tr += "<tr>"; //分割;生成td var td = ""; var trArray = tableArray[i].split(";"); var jCount = 0; for(var j=0;j<trArray.length-1;j++){ //将复选框和复选框后面的内容进行分离生成两个Td var splitTd = trArray[j]; var td1 = splitTd.substring(0,splitTd.indexOf("/>")+2); var td2 = splitTd.substring(splitTd.indexOf("/>")+2,splitTd.length); td += "<td nowrap width='5%' align='center'><div class='table-text-bold-l'>"+td1+"</div></td><td nowrap width='20%' align='center'><div class='table-text-bold-l'>"+td2+"<div></td>"; jCount++; } if(jCount==1){ td += "<td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td><td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td><td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td>"; }else if(jCount==2){ td += "<td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td><td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td>"; }else if(jCount==3){ td += "<td nowrap width='5%' align='center'></td><td nowrap width='20%' align='center'></td>"; } tr += td+"</tr>"; } var endTable = "</table>"; document.getElementById("manageDevice").innerHTML=startTable+tr+endTable; //判断设备类型是否全部未选中,如果全部未选中,那么隐藏可管理的设备 var zequipsInfo = document.getElementsByName("zequipsInfo"); var resultCount = 0; for(var i=0; i<zequipsInfo.length; i++) { if(zequipsInfo[i].checked){ resultCount++; } } if(resultCount==0){ document.getElementById("manageDeviceDiv").style.display="none"; } }, failure: function (response, options) { ("失败", '请求超时!'); }});}}</script><body onload="onload()"><div style="margin-top:2;" > </div><form action="../personAction/updatePersonPopedom.do?personId=<%=request.getParameter("personId") %>" method="post" name="newPersonForm"><fieldset style="PADDING-RIGHT: 4px; PADDING-LEFT: 4px; PADDING-BOTTOM: 4px; PADDING-TOP: 4px; width:100%;"> <table width="100%" border="0" cellspacing="1" cellpadding="0" bgcolor="#cccccc"> <tr bgcolor="F5F7FA"> <td nowrap width="10%" align="center"> <div name="deviceSizeHidden" id="deviceSizeHidden" /> </div> </td> <td nowrap width="90%" align="center"> <div id="deviceType"> </div> </td> </tr> </table> <div id="manageDeviceDiv" style="width:100%;display:none;"> <table width="100%" border="0" cellspacing="1" cellpadding="0" bgcolor="#cccccc"> <tr bgcolor="F5F7FA"> <td nowrap width="10%" align="center"> <div name="deviceHidden" id="deviceHidden" /> </div> </td> <td nowrap width="90%" align="center"> <div id="manageDevice"> </div> </td> </tr> </table> </div> <table width="100%" border="0" cellspacing="0" cellpadding="0"><tr> <td valign="top"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td align="right" valign="bottom" height="36" width="3%"> </td> <td align="right" valign="bottom" height="36" width="97%" > <input type="button" onclick="postForm()" value="保存"/> </td> </tr> </table> </td></tr> </table> </fieldset></form>