标签:public selected mes round window ota 数据 osb get
上面是ztree官方API引入ztree的相关介绍,地址:http://www.treejs.cn/v3/api.php
注:必须先引入jQuery,然后再引入ztree相关js,因为ztree是在jQuery的基础上使用的。
//引入W3C声明 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
//引入插件 <script type="text/javascript" src="js/z_tree/jquery-1.4.4.min.js"></script> <script type="text/javascript" src="js/z_tree/jquery.ztree.core-3.5.js"></script> <script type="text/javascript" src="js/z_tree/jquery.ztree.excheck-3.5.js"></script> <script type="text/javascript" src="js/z_tree/jquery.ztree.exedit-3.5.js"></script> <link rel="stylesheet" href="css/z_tree/zTreeStyle.css" type="text/css">
全部代码:
map.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
//引入W3C声明 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <base href="<%=basePath%>"> <title>map</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> //引入相关插件 <script type="text/javascript" src="js/z_tree/jquery-1.4.4.min.js"></script> <script type="text/javascript" src="js/z_tree/jquery.ztree.core-3.5.js"></script> <script type="text/javascript" src="js/z_tree/jquery.ztree.excheck-3.5.js"></script> <script type="text/javascript" src="js/z_tree/jquery.ztree.exedit-3.5.js"></script> <link rel="stylesheet" href="css/z_tree/zTreeStyle.css" type="text/css"> //引入devMap.js文件 <script type="text/javascript" src="./js/dev/devMap.js"></script> <script type="text/javascript"> $(function() { getdevnumber(); }); </script> </head> <body> <div id="tools_panel_add" onclick="devnumber()"> <div class="BMapLib_box_name">统计</div> <div id="divztree" class="childClass" style="position: absolute; left: 0px; top:64px;display: none; background: #FFF;"> <div class="diyDialog" style="width: 300px;bsckground:#FFF;"> <ul class="ztree" id="treedivid" style="font-size: 16px;overflow: auto;"> </ul> </div> <div id="divztreenumber" style=" background:#FFF;width: 300px; font-size: 16px;display: none;"> <span>终端总数 :</span> <span id="number"></span> <span>个</span> <div></div> <span>已注册 :</span> <span id="yesnumber"></span> <span>个</span> <div></div> <span>未注册 :</span> <span id="nonumber"></span> <span>个</span> </div> </div> </body> </html>
devMap.js
var dev_number=0; function devnumber(){ if(dev_number==0){ $("#divztree").css("display","none"); console.log("dev_number"+dev_number) }else{ var divo=document.getElementById("divztree"); var divoplay=divo.currentStyle["display"]; if(divoplay=="none"){ $("#divztree").css("display","block"); }else{ $("#divztree").css("display","none"); } } } //分区信息调用 function getdevnumber (){ getSectorsBC(loginName,‘1‘,‘10000‘);//这里采用调用js的方法,可替换成别的方式,如ajax异步 window.event.cancelBubble = true;//阻止冒泡时间 } //分区返回数据 function getSectorsCallBackBC(data){ console.log(data); //alert(data); if(data.result == ‘0‘) { var datas=data.msg[0].rows; if(datas.length<0){ }else{ $.fn.zTree.init($("#treedivid"), setting, datas); dev_number=1; } } else { usedMessageTb(‘1‘, "获取分区失败"); } } //setting相关配置可参考ztreesetting详细文档 var setting = { check: { enable: false, chkStyle: "checkbox" }, data: { simpleData: { enable: true, idKey: "id", pIdKey: "parentId", rootPId: 0 } }, async: { enable: true }, view: { expandSpeed: false, autoCancelSelected: false, selectedMulti: false, showLine:true, showTitle: false }, callback: { onClick:getSectorID //点击结点后调用的方法 } }; function getSectorID(event, treeId, treeNode) { var sectorID = treeNode.id; $(‘#sectorId‘).val(sectorID); // 展开树节点 var zTree = $.fn.zTree.getZTreeObj("treedivid"); zTree.expandNode(treeNode, true, false, true); mapgetDevsBC(sectorID); }; //调用js接口,访问后台终端数据 function mapgetDevsBC(sectorID){ console.log("id:"+sectorID); var devmap={"dev_state":3,"dev_switchs":3,"sector_id":sectorID,"condition":"","page":1,"perPage":10000}; console.log(devmap); getDevsBC(loginName,devmap); }; //终端数据返回 function getDevsCallBackBC(data){ console.log("datadatadata:"+data); if(data.result==‘0‘){ var totle=data.msg[0].total;//注册总数 var rows=data.msg[0].rows; var dev_stateyes=0;//注册成功个数 var dev_stateno=0;//注册失败个数 for(var i=0,l=rows.length;i<l;i++){ if(rows[i].dev_state==‘0‘){ dev_stateyes++; }else{ dev_stateno--; } } console.log("**************************"+totle+"********"+dev_stateyes+"*********"+dev_stateno); $(‘#number‘).html(totle); $(‘#yesnumber‘).html(dev_stateyes); $(‘#nonumber‘).html(dev_stateno); $("#divztreenumber").css("display", "block"); }else{ usedMessageTb(‘1‘, "获取终端数量失败"); console.log("reason:"+data.reason); $("#divztreenumber").css("display", "none"); } };
bc_microsys.js
//验证是否为空 function checkNullOfData(data) { if(null == data || "" == data) { return true; } else { return false; } } //验证特殊符号 function illegalChar(str) { if($.inArray("!",str) >= 0) { return false; } if($.inArray("@",str)>= 0) { return false; } if($.inArray("$",str)>= 0) { return false; } if($.inArray("%",str)>= 0) { return false; } if($.inArray("_",str)>= 0) { return false; } if($.inArray(".",str)>= 0) { return false; } if($.inArray("‘",str)>= 0) { return false; } if($.inArray("\"",str)>= 0) { return false; } if($.inArray("\\",str)>= 0) { return false; } if($.inArray("/",str)>= 0) { return false; } if($.inArray(",",str)>= 0) { return false; } if($.inArray("#",str)>= 0) { return false; } if($.inArray("<",str)>= 0) { return false; } if($.inArray(">",str)>= 0) { return false; } if($.inArray("(",str)>= 0) { return false; } if($.inArray(")",str)>= 0) { return false; } return true; } /** * 获取用户权限下的分区信息 */ function getSectorsBC(loginName, page, perPage) { var result = "1"; var reason = "20300"; if(checkNullOfData(loginName)) { alert(loginName) reason = "20301"; return getSectorsCallBackBC(getResult_BC(result, reason)); } else { if(!illegalChar(loginName)) { return getSectorsCallBackBC(getResult_BC("1", "10010")); } } if(checkNullOfData(page)) { page = ‘1‘; } else { if(!illegalChar(page)) { return getSectorsCallBackBC(getResult_BC("1", "10010")); } } if(checkNullOfData(perPage)) { perPage = ‘20‘; } else { if(!illegalChar(perPage)) { return getSectorsCallBackBC(getResult_BC("1", "10010")); } } //跨域 $.ajax( { type: ‘get‘, url: requestUrl + ‘bc_getSecotrInfosByUser.action‘, data: ‘loginName=‘ + loginName + ‘&page=‘ + page + ‘&perPage=‘ + perPage + ‘&time=‘ + new Date().getTime(), dataType: ‘jsonp‘, jsonp: ‘callback‘, jsonpCallback: ‘getSectorsCallBackBC‘, success:function(data) { } }); } /** * 获取用户权限下的终端信息 * */ function getDevsBC(loginName, dev) { var result = "1"; var reason = "20300"; if(checkNullOfData(loginName)) { reason = "20301"; return getDevsCallBackBC(getResult_BC(result, reason)); } else { if(!illegalChar(loginName)) { return getDevsCallBackBC(getResult_BC("1", "10010")); } } if(checkNullOfData(dev)) { reason = "20310"; return getDevsCallBackBC(getResult_BC(result, reason)); } var dev_state = dev.dev_state; if(checkNullOfData(dev_state)) { reason = "20311"; return getDevsCallBackBC(getResult_BC(result, reason)); } else { if(!illegalChar(dev_state)) { return getDevsCallBackBC(getResult_BC("1", "10010")); } } var dev_switchs = dev.dev_switchs; if(checkNullOfData(dev_switchs)) { reason = "20312"; return getDevsCallBackBC(getResult_BC(result, reason)); } else { if(!illegalChar(dev_switchs)) { return getDevsCallBackBC(getResult_BC("1", "10010")); } } var sector_id = dev.sector_id; if(checkNullOfData(sector_id)) { sector_id = ‘‘; } else { if(!illegalChar(sector_id)) { return getDevsCallBackBC(getResult_BC("1", "10010")); } } var condition = dev.condition; if(checkNullOfData(condition)) { condition = ‘‘; } else { if(!illegalChar(condition)) { return getDevsCallBackBC(getResult_BC("1", "10010")); } } var page = dev.page; var perPage = dev.perPage; if(checkNullOfData(page)) { page = ‘1‘; } else { if(!illegalChar(page)) { return getDevsCallBackBC(getResult_BC("1", "10010")); } } if(checkNullOfData(perPage)) { perPage = ‘20‘; } else { if(!illegalChar(perPage)) { return getDevsCallBackBC(getResult_BC("1", "10010")); } } //跨域 $.ajax( { type: ‘get‘, url: requestUrl + ‘bc_getDevInfosByUser.action‘, data: ‘loginName=‘ + loginName + ‘&dev_state=‘ + dev_state + ‘&dev_switchs=‘ + dev_switchs + ‘§or_id=‘ + sector_id + ‘&condition=‘ + encodeURI(condition) + ‘&page=‘ + page + ‘&perPage=‘ + perPage + ‘&time=‘ + new Date().getTime(), dataType: ‘jsonp‘, jsonp: ‘callback‘, jsonpCallback: ‘getDevsCallBackBC‘, success:function(data) { } }); }
因为后台数据在宁外一个项目中取得,宁外一个项目只开放js接口,所以采用的是跨域请求获取后台数据。如果在同一个项目中,可以直接使用ajax异步请求
标签:public selected mes round window ota 数据 osb get
原文地址:https://www.cnblogs.com/ttqi/p/10436331.html