`
y806839048
  • 浏览: 1119226 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

树形结构的jsp展现 (2)

 
阅读更多

1,在没有树形控件等的情况下,后台用sql查询出树形结构数据,前台直接根据标记遍历(其实属性控件也是如此)(用js直接遍历数据)

 

2,还有中方式后台根据父子关系组装成list,前台用jsp标签遍历父子

<div id="div1" style="width:100%;">

</div>

 

$(function(){

 

alert("2");

appendTable();

});

function appendTable() {

 

 

alert("11");

var roleId=$("input[name='roleId']").val();

var leave=$("input[name='leave']").val();

var pId=$("input[name='pId']").val();

var dataParent = {

roleId: roleId,

leave:leave,

pId:pId

 

   };

$.ajax({

        type: "post",

        url: "${pageContext.request.contextPath}/system/opmRole/Auths",

        data: dataParent,

        success: function (data) {

        if(data!=''&&data!=null){

        //alert(data);<table

        var div1=$("#div1");

        //var table1=$("#table1");

        var table1=$("<table></table>");

        var arr = eval(data);

        for(j=0;j<arr.length;j++){

        //alert(arr[j]);

        //alert(arr[j].leave);

        if(arr[j].leave=='1'){//包括两级文件夹

        var row =$("<tr></tr>");

        var td =$("<td></td>");

        td.append($(arr[j].str));

        row.append(td);

        table1.append(row);

        }

        var row2 ;

        if(arr[j].leave=='2'){//页面

        row2 =$("<tr></tr>");

       

        var td =$("<td></td>");

        td.append(arr[j].str);

        row2.append(td);

        table1.append(row2);

       

        }if(arr[j].leave=='3'){//按钮

        var td =$("<td></td>");

        td.append(arr[j].str);

       

        table1.find("tr:last").append(td);

        }

        //table1.append(row2);

        //var strq = JSON.stringify(table1);

        ////alert(strq);

        }

        div1.html(table1);

        //alert(table1);

        }else{

        alert("你输入的会员编号不存在!");

        }

       

        },

        error:function(data){

        alert("数据加载异常!");

       

        }

    }); 

 

 

}

 

 

//全选 选中多选框

function checkedAllBox(obj) {

if(obj.checked){

var a = document.getElementsByName(obj.value);

for (i = 0; i < a.length; i++) {

a[i].checked=true;

}

}else{

var a = document.getElementsByName(obj.value);

for (i = 0; i < a.length; i++) {

a[i].checked=false;

}

}

}

迭代的时候各个层次的数据过了方法就没有,不能共享,要实现类似共享累加:

1,返回值累加,用一个变量专门累加返回值

2,第二次回调前传入要共享的参数

@SuppressWarnings("rawtypes")

@RequestMapping(value="/system/opmRole/Auths")

@ResponseBody

public JSONArray treeRead(@RequestParam(value="leave") String leave,@RequestParam(value="roleId") String roleId,@RequestParam(value="pId")  String pId,@RequestParam(value="groupId",required=false)  String groupId1){

List<String> strl= new ArrayList<String>();

String str="";

JSONArray JsonArray = new JSONArray();

Map<String,Object> param = new HashMap<String,Object>();

param.put("pId", pId);

//OpmMenufolderTreeVo treeVos= new OpmMenufolderTreeVo();

List<Map> map= opmMenufolderService.getfordMenuLimt(param);

Map<String,Object> param1 = new HashMap<String,Object>();

String groupId=groupId1;

for(Map p: map){

 

//List<OpmMenufolderTreeVo> treechild= new ArrayList<OpmMenufolderTreeVo>();

//List<OpmMenuitemTreeVo> opmMenuitem= new ArrayList<OpmMenuitemTreeVo>();

param1.put("pId", p.get("ID"));

String l= (String) p.get("LEAVE");

if("1".equals(l)){

//str+=p.get("ID")+"="+p.get("NAME")+"\n";

if("100000".equals(p.get("PARENTID")+"")){

groupId=(String)p.get("ID");

//OpmMenufolderTreeVo treeVo= new OpmMenufolderTreeVo();

//treeVo.setId(p.get("ID")+"");

//treeVo.setName(p.get("NAME")+"");

//treeVo.setGroupIp(groupId);

//treechild.add(treeVo);

//treeVos.setChildForld(treechild);

   str+="<label style=\"float:left\"><input type=\"checkbox\" class=\"checkboxCtrl\" value="+p.get("ID")+" group="+groupId+" selectType=\"invert\" />"+p.get("NAME")+"</label>"+"\n";

   strl.add(str);

   JSONObject Json = new JSONObject();

   Json.put("ID", p.get("ID")+"");

   Json.put("NAME", p.get("NAME")+"");

   Json.put("groupId", groupId);

   Json.put("parentId", p.get("PARENTID"));

   Json.put("leave", l);

   Json.put("str", "<label style=\"float:left\"><input type=\"checkbox\" class=\"checkboxCtrl\" value="+p.get("ID")+"  onclick=\"checkedAllBox(this);\" group="+groupId+" //>"+p.get("NAME")+"</label>"+"\n");

   JsonArray.add(Json);

   

   

}else{

//OpmMenuitemTreeVo treeVo= new OpmMenuitemTreeVo();

//treeVo.setId(p.get("ID")+"");

//treeVo.setName(p.get("NAME")+"");

//treeVo.setGroupIp(groupId);

//opmMenuitem.add(treeVo);

//treeVos.setOpmMenuitem(opmMenuitem);<input type=\"checkbox\" value="+p.get("ID")+" name="+groupId+"/>

str+="<label><input type=\"checkbox\" value="+p.get("ID")+" name="+groupId+"/>"+p.get("NAME")+"</label>"+"\n";

strl.add(str);

JSONObject Json = new JSONObject();

   Json.put("ID", p.get("ID")+"");

   Json.put("NAME", p.get("NAME")+"");

   Json.put("groupId",groupId);

   Json.put("parentId", p.get("PARENTID"));

   Json.put("leave", l);

   Json.put("str","<label>&nbsp;&nbsp;&nbsp;"+p.get("NAME")+"</label>"+"\n");

   JsonArray.add(Json);

}

}

if("2".equals(l)){

if(Integer.valueOf(leave)<0){

if(Integer.valueOf(p.get("LEAVE1")+"") >=Integer.valueOf(leave)){

//str+=p.get("ID")+"="+p.get("NAME")+"\n";

str+="<label><input type=\"checkbox\" value="+p.get("ID")+"  name="+groupId+"/>"+p.get("NAME")+"</label>"+"\n";

strl.add(str);

JSONObject Json = new JSONObject();

   Json.put("ID", p.get("ID")+"");

   Json.put("NAME", p.get("NAME")+"");

   Json.put("groupId", groupId);

   Json.put("parentId", p.get("PARENTID"));

   Json.put("leave", l);

   Json.put("str","<label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type=\"checkbox\" value="+p.get("ID")+"  name='"+groupId+"'/>"+p.get("NAME")+"</label>"+"\n");

   JsonArray.add(Json);

}

}else{

//TODO

Map<String,Object> param2 = new HashMap<String,Object>();

param2.put("menuItemId", p.get("ID"));

param2.put("menuItemLimitId", null);

param2.put("roleId", roleId);

param2.put("displayOrder", Integer.valueOf(-1));

List<OpmRolelimit> rl= opmRolelimitService.getRoleLimitByTJ(param2);

if(rl!=null&&rl.size()>0&&Integer.valueOf(p.get("LEAVE1")+"") >=Integer.valueOf(leave)){

//str+=p.get("ID")+"="+p.get("NAME")+"\n";

str+="<label><input type=\"checkbox\" value="+p.get("ID")+" name="+groupId+"/>"+p.get("NAME")+"</label>"+"\n";

strl.add(str);

JSONObject Json = new JSONObject();

   Json.put("ID", p.get("ID")+"");

   Json.put("NAME", p.get("NAME")+"");

   Json.put("groupId", groupId);

   Json.put("parentId", p.get("PARENTID"));

   Json.put("leave", l);

   Json.put("str","<label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type=\"checkbox\" value="+p.get("ID")+" name='"+groupId+"'/>"+p.get("NAME")+"</label>"+"\n");

   JsonArray.add(Json);

}

}

}

if("3".equals(l)){

Map<String,Object> param2 = new HashMap<String,Object>();

param2.put("menuItemId", p.get("PARENTID"));

param2.put("menuItemLimitId", p.get("ID"));

param2.put("roleId", roleId);

param2.put("displayOrder", null);

List<OpmRolelimit> rl2= opmRolelimitService.getRoleLimitByTJ(param2);

String tempg=groupId;

if(rl2!=null&&rl2.size()>0){

//str+=p.get("ID")+"="+p.get("NAME")+"\n";

str+="<label><input type=\"checkbox\"  value="+p.get("ID")+" name="+groupId+"/>"+p.get("NAME")+"</label>"+"\n";

strl.add(str);

JSONObject Json = new JSONObject();

   Json.put("ID", p.get("ID")+"");

   Json.put("NAME", p.get("NAME")+"");

   Json.put("groupId", groupId);

   Json.put("parentId", p.get("PARENTID"));

   Json.put("leave", l);

   Json.put("str","<label><input type=\"checkbox\"  value="+p.get("ID")+" name='"+groupId+"'/>"+p.get("NAME")+"</label>"+"\n");

   JsonArray.add(Json);

}

}

str+=treeRead(leave,roleId,p.get("ID")+"",groupId);

//strl.add(treeRead(param1,level,roleCurId,groupId));

JsonArray.addAll(treeRead(leave,roleId,p.get("ID")+"",groupId));

}

return JsonArray;

}

 

 

service:

@Override

public List<Map> getfordMenuLimt(Map<String,Object> param) {

// TODO Auto-generated method stub

List<Map> map = new ArrayList<>();

map= (List<Map>) opmMenufolderMapper.getfordMenuLimt(param);

return map;

}

 

map.java

public interface OpmMenufolderMapper extends Mapper<OpmMenufolder> {

 

List<?> getfordMenuLimt(Map<String,Object> param);

}

 

map.xml

 <resultMap id="BaseResultMap" type="com.esteel.system.bean.OpmMenufolder" >

    <!--

      WARNING - @mbggenerated

    -->

    <id column="ID" property="id" jdbcType="VARCHAR" />

    <result column="NAME" property="name" jdbcType="VARCHAR" />

    <result column="DISPLAYORDER" property="displayorder" jdbcType="DECIMAL" />

    <result column="PARENTID" property="parentid" jdbcType="VARCHAR" />

    <result column="URI" property="uri" jdbcType="VARCHAR" />

    <result column="DESCRIPTION" property="description" jdbcType="VARCHAR" />

    <result column="ICONCSS" property="iconcss" jdbcType="VARCHAR" />

    <result column="SUBSYSTEM" property="subsystem" jdbcType="VARCHAR" />

  </resultMap>

  

  <select id="getfordMenuLimt" resultType="map" parameterType="map">

    select * from (select * from 

(   

     select t.name name,t.id  id,t.parentid  parentid ,0 leave1,'1' leave from opm_menufolder t 

   union all select o.name name,o.id id,o.menufolderid,o.level1 leave1,'2' leave  from opm_menuitem o

   union all select l.name name,l.id id,l.menuitemid ,l.level1 leave1,'3' leave  from opm_menuitemlimit l

start with parentid is null connect by prior id=parentid ORDER SIBLINGS BY parentid) where parentid=#{pId}

  

  </select>

 

分享到:
评论

相关推荐

    jsp ajax tree 树形结构菜单

    **JSP AJAX Tree:构建动态树形结构菜单** 在Web应用开发中,树形结构菜单是一种常见的用户界面元素,用于组织和展示层次化的数据。在传统的网页中,每当用户点击节点时,整个页面需要重新加载,用户体验往往不佳。...

    ajax树形结构

    在IT行业中,Ajax树形结构是一种常见的...以上就是关于"jsp + servlet + ajax 展现的树形结构"的知识点详解。这个项目展示了如何利用这些技术构建一个交互式的、动态加载数据的树形视图,为用户提供更好的浏览体验。

    jsp树形菜单

    5. **渲染菜单**:使用JSP标签库(Tag Libraries)或自定义标签来生成HTML结构,根据数据的层级关系构建树形结构。 6. **添加交互**:利用JavaScript处理用户点击事件,实现节点的展开和折叠功能。 7. **样式设计*...

    jsp实现树状结构源码

    在Web应用中,树形结构可以用于展现目录层级、导航菜单、权限管理等场景。`JSP`实现树状结构通常涉及以下关键知识点: 1. **HTML/CSS**:用于构建用户界面的基本框架,如节点的显示、展开/折叠按钮、样式等。 2. *...

    Struts1和dTree的结合,显示树形结构

    dTree则是一款JavaScript库,用于在网页中生成交互式的树形结构,常用于展现层次化的数据。将Struts1与dTree结合,可以在服务器端处理数据并将其以树形结构的形式在客户端展示,提供用户友好的浏览体验。 **Struts1...

    ajax 方式实现的动态树形结构,从库中取数据

    在IT领域,动态树形结构是一种常见的用户界面元素,它被广泛用于展现层次化数据,如文件系统、组织架构或数据库中的分类数据。在这种结构中,节点可以展开或折叠,以便用户能方便地浏览和操作数据。在本案例中,我们...

    树形菜单显示集锦(jsp版)

    4. **xTree**:xTree是另一个流行的选择,它提供了一种简洁而强大的方式来构建交互式的树形结构。xTree支持多种节点样式,具有良好的性能和扩展性,可以与JSP结合,利用AJAX技术实现实时更新和异步操作。 5. **JSP ...

    dTree+jquery实现动态树形

    在压缩包中的"tree2.jsp"文件可能是一个示例页面,展示了如何在JSP(JavaServer Pages)环境中使用dTree和jQuery实现动态树形结构。JSP是一种用于开发动态Web内容的Java技术,它允许将HTML代码与Java代码混合编写,...

    jsp+servlet的菜单树

    树形结构是一种常见的用户界面元素,尤其适用于展现层级关系的数据,如文件系统、组织结构或信息系统中的权限管理。在本项目中,菜单树可能采用递归方式生成,根据用户角色和权限动态加载各个菜单节点。菜单项可以...

    网页动态树形菜单图

    5. 渲染菜单:收到数据后,JavaScript动态创建HTML元素,构建树形结构。 6. 交互处理:添加事件监听器,如点击节点时触发展开/折叠,或者加载子节点等操作。 此外,为了优化性能和用户体验,还可以考虑使用虚拟滚动...

    树形表格 treetable 完整版 带演示demo例子

    在IT领域,树形表格(TreeTable)是一种特殊的数据展示方式,它结合了表格和树状结构的优点,常用于组织层次分明、具有父子关系的数据。本文将深入探讨“树形表格treetable完整版”,包括它的特点、应用场景、二次...

    用jsp实现类似资源管理器的树状菜单

    `Tree`类是整个程序的核心,其主要职责是通过遍历指定目录下的所有文件和子文件夹,构建出树形结构。这涉及到递归地访问每个目录,为每个文件或文件夹创建相应的`Node`对象,并将其添加到`NodeList`中。`Tree`类还...

    jsp源码其他类别JSP无限级分类目录树-sorttree

    3. **前端渲染**:利用JSP页面来渲染数据,生成可视化的树形结构。 #### 三、具体实现步骤 ##### 3.1 数据模型设计 在设计无限级分类目录树之前,需要先明确数据模型。假设我们有一个名为`Category`的表,其中...

    我见过最好的jsp菜单树

    这里的“tree”标签进一步确认了这个组件是关于树形结构的展现。 在【压缩包子文件的文件名称列表】中: 1. **dtree.css** - 这是样式表文件,负责定义菜单树的外观和布局。CSS(层叠样式表)允许开发者控制元素的...

    jsp动态树

    【jsp动态树】是一种在JavaServer Pages (JSP) 中实现的交互式树形结构,通常用于展现层次化的数据,如目录结构、组织架构或数据库记录。这种动态树的实现结合了服务器端的JSP技术和客户端的JavaScript,使得用户...

    各种语言脚本的树形菜单代码大全

    在IT领域,特别是网页开发中,树形菜单代码是一种常用的技术,用于构建具有层次结构的导航系统。"各种语言脚本的树形菜单代码大全"这个资源包集合了多种编程语言和方法来创建这种功能,包括CSS(层叠样式表)、...

    协同办公b/s用jsp 和servlet写的

    通过实践,初学者可以深入理解JSP和Servlet的工作原理,了解如何在实际项目中使用Oracle数据库,以及如何构建和应用树形结构。同时,它还提供了在线消息、文件管理等功能,这些是协同办公系统中的常见需求,有助于...

    treeTable树形显示

    TreeTable是一种在网页中以树状结构展示数据的表格组件,它将表格和树形视图结合在一起,常用于组织和展示层次结构的数据。在给定的“treeTable(jeesite使用)”压缩包中,我们可以找到一个基于Java Web框架Jeesite...

    电影院售票系统 jsp 基于 web开发

    例如,树形结构可能包括“影院名→楼层→厅号”,用户可以逐级展开节点,选择合适的观影地点。 Web开发中,通常会采用MVC(Model-View-Controller)设计模式。在这个模式下,模型(Model)负责管理数据和业务逻辑,...

Global site tag (gtag.js) - Google Analytics