`
357029540
  • 浏览: 735034 次
  • 性别: Icon_minigender_1
  • 来自: 重庆
社区版块
存档分类
最新评论

Extjs通过structs2生成树结构

阅读更多
Extjs为我们提供了强大的树的生成方式,我们不必通过原始的js去生成树形结构。在这里我做了一个简单的树结构生成。代码如下,同时在后台使用了fastjson-1.1.15.jar的jar包生成json对象,Extjs使用的是3.2版本。


          Java文件代码:

Bo类:     



import java.util.List;

public class TreeBo {
private int id;//节点id
private String text;//节点显示名称
private String cls;//节点图标
private Boolean leaf;//是否叶子节点
private List<TreeBo> children;//下级节点

.......//省略了相应的getter/setter方法

}

action类:



import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.List;

import javax.servlet.http.HttpServletResponse;

import org.apache.struts2.ServletActionContext;

import com.alibaba.fastjson.JSONObject;
import com.test.bo.TreeBo;

public class FunctionListAction {

private List<TreeBo> treeList;

  public void testTree(){
  treeList = new ArrayList<TreeBo>();
  TreeBo cdAllMilitary = new TreeBo();
  cdAllMilitary.setText("成都军区");
  cdAllMilitary.setCls("folder");
  cdAllMilitary.setLeaf(false);
  cdAllMilitary.setId(1);
  treeList.add(cdAllMilitary);
 
  List<TreeBo> cdMilitary = new ArrayList<TreeBo>();
  cdAllMilitary.setChildren(cdMilitary);
  TreeBo cq = new TreeBo();
  cq.setText("重庆军区");
  cq.setCls("folder");
  cq.setLeaf(true);
  cq.setId(11);
  cdMilitary.add(cq);
  TreeBo km = new TreeBo();
  km.setText("昆明军区");
  km.setCls("folder");
  km.setLeaf(true);
  km.setId(12);
  cdMilitary.add(km);
 
  TreeBo bjAllMilitary = new TreeBo();
  bjAllMilitary.setText("北京军区");
  bjAllMilitary.setCls("folder");
  bjAllMilitary.setLeaf(false);
  bjAllMilitary.setId(2);
  treeList.add(bjAllMilitary);
 
  List<TreeBo> bjMilitary = new ArrayList<TreeBo>();
  bjAllMilitary.setChildren(bjMilitary);
  TreeBo bj = new TreeBo();
  bj.setText("北京军区");
  bj.setCls("folder");
  bj.setLeaf(true);
  bj.setId(21);
  bjMilitary.add(bj);
 
  TreeBo tj = new TreeBo();
  tj.setText("天津军区");
  tj.setCls("folder");
  tj.setLeaf(true);
  tj.setId(22);
  bjMilitary.add(tj);
 
  HttpServletResponse response = ServletActionContext.getResponse();
  response.setCharacterEncoding("utf-8");
  try {
   PrintWriter writer = response.getWriter();
   writer.print(JSONObject.toJSON(treeList).toString());
  } catch (IOException e) {
   e.printStackTrace();
  }
}

JSP文件:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
     <link rel="stylesheet" type="text/css" href="./ext/resources/css/ext-all.css">
     <script type="text/javascript" src="./ext/adapter/ext/ext-base.js"></script>
     <script type="text/javascript" src="./ext/ext-all.js"></script>
     <script type="text/javascript" src="./js/tree.js"></script>
     <link rel="stylesheet" type="text/css" href="./css/menu.css">

</head>
  <body>
    <div id="container">
     <div id="tree"></div>
</div>
  </body>
</html>

css文件:主要是menu.css

#container {
    width:650px;
    height:330px;
    border:3px solid #c3daf9;

}

js文件:主要是tree.js

Ext.onReady(function(){

var tree = new Ext.tree.TreePanel({
     el:'tree',
     autoScroll:true,
     animate:true,
     enableDD:true,
     containerScroll:true,
     loader:new Ext.tree.TreeLoader({dataUrl:'function_testTree.action'})
});
var root = new Ext.tree.AsyncTreeNode({
     text:'中国军区',
     draggable:false,
     id:'testTree'
});
tree.setRootNode(root);
tree.render();
root.expand();
});

struct配置文件:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
    "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
    "http://struts.apache.org/dtds/struts-2.0.dtd">

<struts>
<package name="struts2" namespace="/" extends="struts-default">





<action name="function_*" class="com.test.action.FunctionListAction" method="{1}">

</action>

</package>

</struts>
效果如图所示:
分享到:
评论

相关推荐

    Extjs+Struts2系统后台管理框架,完美运行

    Struts2支持多种视图技术,包括JSP、FreeMarker等,可以方便地与ExtJS结合,生成动态的EXTJS界面。 **两者结合的优势** 将ExtJS与Struts2结合,可以在后端利用Struts2强大的控制器层处理业务逻辑,而在前端使用...

    extjs动态树struts请求数据

    在这一过程中,Struts作为MVC框架负责后端业务逻辑处理,而ExtJS则作为前端展示库,通过Ajax请求获取Struts返回的数据,并将其渲染为动态树形结构。主要涉及的知识点包括: 1. **ExtJS动态树(TreePanel)**: ExtJS...

    extjs+struts1图书管理系统

    在"extjs+struts1图书管理系统"中,开发者可能会遇到一些关键技术点,例如如何利用ExtJS组件构建动态表格,如何使用Struts1的ActionForm和ActionMapping进行数据处理,以及如何通过Ajax技术实现前后端异步通信等。...

    extjs3.0+struts2源码

    通过研究这些源码,开发者可以学习到如何配置Struts2的配置文件(如struts.xml),理解Action的生命周期,以及如何在ExtJS中创建自定义组件和使用Ajax进行异步通信。 总结一下,这个"extjs3.0+struts2 源码"项目...

    用extjs加struts做的web-QQ聊天程序源代码

    2. **STRUTS框架**:Struts负责处理来自EXTJS前端的请求,并进行相应的业务逻辑处理。例如,当用户发送消息时,前端可能会向后端发起一个POST请求,Struts控制器会捕获这个请求,调用相应的服务层方法处理消息发送,...

    extjs4springstruts2ibatis

    ExtJS4、Spring、Struts2和iBatis是Java Web开发中常用的技术栈,它们在构建企业级应用中发挥着各自的关键作用。下面将详细解释这些技术以及它们如何协同工作。 1. ExtJS4:这是一款强大的JavaScript库,用于构建富...

    struts2与extjs tree的完美结合

    在这个“struts2与extjs tree的完美结合”的示例中,开发者利用了Struts2的Annotation特性来简化配置,以及Struts2JSON插件来处理JSON数据,从而实现在服务器端动态生成和返回Tree节点。Annotation使得开发者能够在...

    struts2-extjs4.rar

    通过这个示例项目,开发者可以学习如何设置Struts2的Action来生成JSON,如何在ExtJS4中配置Ajax请求,以及如何解析和展示接收到的JSON数据。这有助于理解和掌握两者的集成技术,从而在实际项目中实现更高效的数据...

    Extjs Tree + JSON + Struts2 示例源代码

    ExtJS Tree + JSON + Struts2 示例源代码是结合了三种技术来实现一个动态的、交互式的树形数据展示的应用。这个示例中,ExtJS用于前端UI的构建,JSON作为数据交换格式,而Struts2则作为后端MVC框架处理请求和返回...

    ExtJS4+Accordion+SERVLET/STRUTS2+JSON+Ext.tree.Panel实例

    例如,Ext.tree.Panel可能会通过Ajax请求从服务器获取JSON格式的树结构数据,然后动态渲染出树形视图。 Ext.tree.Panel是ExtJS中的一个组件,用于展示树状数据结构。它可以显示多级嵌套的节点,支持拖放操作,节点...

    Extjs Tree + JSON + Struts2

    ExtJS Tree + JSON + Struts2 是一个常见的前端与后端交互技术组合,常用于构建动态的、数据驱动的树形结构界面。在这个项目中,`index.html` 是主页面,`tree.js` 包含了 ExtJS 的树组件相关的 JavaScript 代码,`...

    struts2+extjs整合包

    同时,ExtJS可以通过Store和Proxy组件来管理和加载由Struts2返回的数据。 总的来说,这个整合包提供了开发基于Struts2和ExtJS的Web应用所需的基本组件,可以快速构建出高效、交互性强的Web应用。开发者需要理解这两...

    extjs tree + json+struts2示例源代码

    在Struts2中,我们可以创建一个Action类,处理请求,查询数据库获取树结构数据,并将其转换为JSON格式,然后通过Struts2的Result类型返回给前端。 为了实现这个功能,你需要遵循以下步骤: 1. **配置Struts2**:在...

    ExtJS_Tree利用_JSON_在Struts_2实现Ajax动态加载树结点

    通过以上步骤,我们就能实现一个基于ExtJS Tree、JSON和Struts 2的Ajax动态加载树结构。这种技术允许我们仅加载当前需要的节点,提高应用的性能,并且可以轻松地与服务器端数据进行交互。同时,由于采用了JSON格式,...

    struts2-hibernate-spring-Extjs-json.rar_JSON_extjs_extjs json st

    Struts2、Hibernate、Spring 和 ExtJS 是Java Web开发中常用的技术栈,它们共同构建了高效、可维护的Web应用程序。这个压缩包“struts2-hibernate-spring-Extjs-json.rar”显然包含了关于这些技术整合使用的参考资料...

    Struts2(json-plugin) + Spring2 + ExtJS2.2 开源网络硬盘系统

    ExtJS是一个用于构建富客户端(Rich Internet Applications,RIA)的JavaScript库,它提供了大量的可重用组件,如表格、树形结构、面板、表单等,以及强大的布局管理机制。在本项目中,ExtJS2.2用于构建用户界面,...

    struts+ExtJS

    Struts Action需要能够生成JSON响应,而ExtJS的Store则能解析这些响应并更新UI。 6. **前端布局和组件**:ExtJS的组件库可以用来构建复杂的UI,例如使用GridPanel展示从服务器获取的数据,使用FormPanel进行表单...

    Hibernate+Spring+Struts2+ExtJS开发CRUD功能

    开发者通过`my_no_lib.zip`可能包含了项目的源代码和配置文件,`Hibernate+Spring+Struts2+ExtJS开发CRUD功能.doc`可能是详细的开发指南或者项目说明文档,帮助理解如何整合这些框架实现CRUD功能。 通过深入学习和...

    n多树型菜单大集合,struts树 jquery树 dttree等

    Struts Tree组件通过Action类处理请求,返回树结构的XML或JSON数据,然后在客户端通过JavaScript进行渲染。这种实现方式的优势在于它与服务器端的数据模型紧密结合,可以方便地更新和维护。 2. **jQuery Tree**: ...

    JPA STRUTS SPRING EXTJS JSON 同学录

    2. **Struts**: Struts 是一个基于 MVC(Model-View-Controller)设计模式的Java Web框架。在这个项目中,Struts 可能负责处理HTTP请求,调度控制逻辑,以及协调模型、视图和控制器之间的交互。开发者可以通过定义...

Global site tag (gtag.js) - Google Analytics