树状结构对象的获取及遍历

来源：互联网发布：国外免费linux服务器编辑：程序博客网时间：2024/05/01 00:51

在程序开发过程中我们有时候需要在页面上实现树状结构数据的展现，比如地区树状这是很常见的需求。以下是我做的地区二级联动菜单，我是在页面初始化时从数据库中获取已经封装好的Area对象，这个对象包含我们需要的数据结构，只需在页面上序列化成Json然后遍历Json就Ok了。

Area对象

package com.nstc.gdms.model;import java.util.LinkedList;public class Area {private String areaNo;// 地区编号private String areaName;// 地区名称private List<Area> subAreas; // 下级地区public String getAreaNo() {return areaNo;}public void setAreaNo(String areaNo) {this.areaNo = areaNo;}public String getAreaName() {return areaName;}public void setAreaName(String areaName) {this.areaName = areaName;}public void addSubAreas(Area area) {if(subAreas == null){this.subAreas = new LinkedList<Area>();}this.subAreas.add(area);}public void setSubAreas(List<Area> subAreas) {this.subAreas = subAreas;}public List<Area> getSubAreas() {return subAreas;}@Overridepublic String toString() {return "Area [areaNo=" + areaNo + ", areaName=" + areaName + "]";}}

数据库表的结构主要关注三个字段ID_、NAME_和PARENTID_,其中ID_是地区编号，NAME_是地区名称，

PARENTID_是父节点,其值为空时表示中国，一下是sql语句：

<select id="findAreaTree" resultClass="java.util.HashMap">        SELECT NAME_ AS "areaName",ID_ AS "areaNo",PARENTID_ AS "parentId" FROM CB_BA_AREA_CODE ORDER BY level_ , order_ </select>

service层，把符合条件的Area对象返回页面即可

 /**    * 取地区树 */public Area findAreaTree() {List<Map<String,String>> pMaps = accountAccessor.findAreaTreeMap();Map<String,Area> areaPool = new HashMap<String,Area>();Area root = null;for(Map<String,String> map:pMaps){Area area = new Area();String areaNo = map.get("areaNo") == null?"":String.valueOf(map.get("areaNo"));String areaName = map.get("areaName");area.setAreaNo(areaNo);area.setAreaName(areaName);String parentId = map.get("parentId") == null?"":String.valueOf(map.get("parentId"));Area parentNode = areaPool.get(parentId);if(parentNode != null){parentNode.addSubAreas(area);}areaPool.put(area.getAreaNo(), area);if("".equals(parentId)){root = area;}}return root;}

jsp页面

<html>  <head>  <%@ page import="com.nstc.uas.util.JsonUtil" %>  <%      Area area = (Area)request.getAttribute("area");  %>  <title>设置开户银行</title>  <META http-equiv="Content-Type" content="text/html; charset=GBK">  <jsp:include page="commons.jsp"/>  <style type="text/css">      #removeElement,#modifyElement{          width:28px;      }      #cmdDelete,#addElement{          width:28px;          padding-left:4px;      }  </style>  <script>  var areaData = <%=net.sf.json.JSONObject.fromObject(area).toString() %>;    function _buildOptions(select,arr){      for(var i=0,l=arr.length;i<l;i++){          var ps = arr[i];          var oo = document.createElement('option');          oo.value=ps.areaNo;          oo.innerText=ps.areaName;          select.appendChild(oo);      }  }    function _getSubAreas(_cselect,pAreaNo){      _cselect.innerHTML="";      for(var ii=0,ll=areaData.subAreas.length;ii<ll;ii++){          var prov = areaData.subAreas[ii];          if(prov.areaNo==pAreaNo){               _buildOptions(_cselect,prov.subAreas);              break;          }      }  }    function _getProvinceNo(cAreaNo,arr){      for(var i=0,l=arr.length;i<l;i++){          var ps = arr[i];          for(var j=0,k=ps.subAreas.length;j<k;j++){              if(ps.subAreas[j].areaNo==cAreaNo){                  return ps.areaNo;              }                        }                }  }    function addEvent(obj,type,handle){      try{  // Chrome、FireFox、Opera、Safari、IE9.0及其以上版本          obj.addEventListener(type,handle,false);      }catch(e){          try{  // IE8.0及其以下版本              obj.attachEvent('on' + type,handle);          }catch(e){  // 早期浏览器              obj['on' + type] = handle;          }      }  }    function addItem(){      var deleteButton = deleteRowButton();        // 删除按钮      var addNewRowMark = buildAddCheck(itemNo);   // 新增标志            deleteButton.className="button";        var bank = buildSelect("E_BankNo_" + itemNo , optionText , optionValue);      bank.style.width = "100%";            // 增加联动选择框：1级选择框      var _pselect = document.createElement("select");      _pselect.style.width = "40%";      _pselect.className='province';      _pselect.name='province_'+itemNo;      _buildOptions(_pselect,areaData.subAreas);            //debugger;      // 增加联动选择框：2级选择框      var _cselect = document.createElement("select");      _cselect.style.width = "60%";      _cselect.className='city';      _cselect.name='city_'+itemNo;      _getSubAreas(_cselect,_pselect.value);            addEvent(_pselect,"change", function(){          _getSubAreas(_cselect,_pselect.value);      });            var acntNo = buildText("E_AcntNo_" + itemNo,"","style=width:100%");      var pay = buildText("E_OpenBankName_" + itemNo,"","style=width:100%");      var openBankNo = buildText("E_OpenBankNo_" + itemNo,"","alt=成员单位开户行行号   maxlength='12'");      openBankNo.style.width="77%";      var choiceButton = buildButton("E_OpenBankNo_" + itemNo+"Button","选择");      choiceButton.className="button button25";      choiceButton.onclick= new Function("selectEdcBank('"+openBankNo.name+"');");      var acntName = buildText("E_AcntName_"+itemNo,"","style=width:100%");      var depRate = buildFloatText("E_DepositPercent_" + itemNo,"","style=width:100%");      depRate.style.width = "100%";      depRate.style.textAlign="right";      depRate.value = "1.0";      depRate.style.display="none";      var operating =document.createElement("span");      operating.innerText = '未保存';      var array = new Array() ;  // 保存每一行的内容，每个元素对应一个单元格      array.push(new Array(deleteButton, "Center" , "middle"));      array.push(new Array(addNewRowMark, "Center" , "middle"));      array.push(new Array(bank , "left" , "middle"));      array.push(new Array(acntNo , "left" , "middle"));      array.push(new Array(acntName , "left","middle"));      array.push(new Array(pay , "left" , "middle"));      array.push(new Array(openBankNo,choiceButton, "left" , "middle"));      array.push(new Array(_pselect ,_cselect, "left" , "middle"));      array.push(new Array(depRate,operating, "Center" , "middle"));        var row = addRow(array , "AcntTable") ;      addNewRowMark.checked = true;      bank.focus();   }  </script>    </head>  <body style="overflow:hidden;" >  <FORM Name="AcntForm" Method="post" Action="bms_rb_00_32.do">  <table border="0" align="center" width="100%" cellspacing=0 height="100%">      <tr valign="top" height="100%">          <td height="100%" valign="top">              <div id="lockedDiv">              <TABLE Id="AcntTable" class="table" Width="100%" Border="0" CellSpacing="0" CellPadding="5" style="margin-top:0px;">                  <TR>                    <TH Width="5%" Align="Center">删</TH>                    <TH Width="5%" Align="Center">改</TH>                    <TH Width="12%">银行</TH>                    <TH Width="12%">账户</TH>                    <TH width="10%">户名</TH>                    <TH Width="18%">开户银行</TH>                    <TH Width="18%">开户银行行号</TH>                    <TH Width="12%">所属地区</TH>                    <TH Width="8%" Align="Center">操作</TH>                  </TR>              </TABLE>              </div>          </td>      </tr>  </table>  </FORM>  </body>  </html>

1 0