`

jQuery treeview在JSP中的应用：ASYNC

JSPjQueryJavaScriptCSSHTML 
阅读更多 
1. async.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"

    pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

    <head>

       <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

       <title>Insert title here</title>

       <link rel="stylesheet" href="css/jquery.treeview.css" />

       <link rel="stylesheet" href="css/screen.css" />

 

       <script src="javascript/jquery.js" type="text/javascript"></script>

       <script src="javascript/jquery.cookie.js" type="text/javascript"></script>

       <script src="javascript/jquery.treeview.js" type="text/javascript"></script>

       <script src="javascript/jquery.treeview.async.js"

           type="text/javascript"></script>

 

       <script type="text/javascript">

           $(document).ready(function(){

              $("#black").treeview({

                  url: "source.html",

                  control: "#treecontrol",

                  persist: "location"

              });

           });

       </script>

    </head>

    <body>

       <h1 id="banner">

           <a

              href="http://bassistance.de/jquery-plugins/jquery-plugin-treeview/">jQuery

              Treeview Plugin</a> Demo

       </h1>

       <div id="main">

           <a href=".">Main</a>

           <h4>

              Sample - async

           </h4>

           <div id="treecontrol">

              <a title="Collapse the entire tree below" href="#"><img

                     src="images/minus.gif" /> Collapse All</a>

              <a title="Expand the entire tree below" href="#"><img

                     src="images/plus.gif" /> Expand All</a>

              <a

                  title="Toggle the tree below, opening closed branches, closing open branches"

                  href="#">Toggle All</a>

           </div>

           <ul id="black">

           </ul>

       </div>

    </body>

</html>

 

2. SourceController

@Controller

public class SourceController {

 

    @Autowired

    SourceService sourceService;

 

    @RequestMapping("/source.html")

    public void source(HttpServletRequest request, HttpServletResponse response)

           throws IOException {

       request.setCharacterEncoding("utf-8");

       response.setContentType("text/json;charset=UTF-8");

 

       PrintWriter out = response.getWriter();

       String root = request.getParameter("root");

       String output = sourceService.generateNodeString(root);

       out.print(output);

       out.flush();

       out.close();

    }

}

 

3. SourceService

@Service("sourceService")

public class SourceService {

 

    @Autowired


    TestDao testDao;


    

    public String generateNodeString(String root) {

       if (root == null) {

           return "";

       } else if (root.equalsIgnoreCase("source")) {

           return generateTopTreeString();

       } else {

           return generateSubTreeString(Long.parseLong(root));

       }

    }

 

    private String generateTopTreeString() {

       StringBuilder sb = new StringBuilder();

       sb.append("[");

 

       List<Item> list = testDao.findTopItem();

 

       int i = 0;

       for (Iterator<Item> it = list.iterator(); it.hasNext(); i++) {

           if (i > 0) {

              sb.append(",");

           }

           Item item = (Item) it.next();

           sb.append(generateNodeString(item));

       }

 

       sb.append("]");

       return sb.toString();

    }

 

    private String generateSubTreeString(Long itemId) {

       StringBuilder sb = new StringBuilder();

       sb.append("[");

 

       List<Item> list = testDao.findSubItem(itemId);

 

       int i = 0;

       for (Iterator<Item> it = list.iterator(); it.hasNext(); i++) {

           if (i > 0) {

              sb.append(",");

           }

           Item item = (Item) it.next();

           sb.append(generateNodeString(item));

       }

 

       sb.append("]");

       return sb.toString();

    }

 

    private String generateNodeString(Item item) {

       StringBuilder sb = new StringBuilder();

       sb.append(" {");

       sb.append("  \"text\": \"" + generateLinkString(item) + "\"");

 

       if (testDao.hasSubItem(item.getItemId())) {

           sb.append(",  \"id\":\"" + item.getItemId() + "\"");

           sb.append(",  \"hasChildren\":true");

       }

 

       sb.append(" }");

       return sb.toString();

    }

 

    private String generateLinkString(Item item) {

       return "<a href='menu.html?menuId=" + item.getItemId()

              + "' target='main' >" + item.getItem() + "</a>";

    }

}

 

4. Item

 

public class Item implements java.io.Serializable {

……

private Long itemId;

    private String item;

    private Long itemLevel;

    private Set<Item> itemsForParentId = new HashSet<Item>(0);

    private Set<Item> itemsForItemId = new HashSet<Item>(0);

……

}

 

本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/lz_net/archive/2009/08/17/4457097.aspx

分享到：
| jQuery treeview 在jsp中的应用
评论
5 楼 wenkaishun 2011-11-04  
这里有http://www.rssbar.org/s/helloword4java/
4 楼 maolin 2010-12-13  
能不能把完整代码贴出来？
3 楼 king130520 2010-09-30  
能不能把dao 的代码也贴出来？？
2 楼 king130520 2010-09-30  
我看漏了，不好意思。求交朋友QQ：51073244 验证：javaeye
1 楼 king130520 2010-09-30  
有效果图吗？？？你这个没有用ajax 它怎么将 StringBuilder sb = new StringBuilder();   完整的传过去？？？
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    jquery treeview async

    然后，使用以下jQuery代码初始化Treeview： ```javascript $(document).ready(function () { $("#treeview").treeview(); }); ``` 在“async”加载模式下，我们不再预先加载所有节点，而是当用户展开某个节点时，...

    jquery treeview demo

    然后，在文档底部引入所需的库文件和自定义样式，并初始化TreeView： ```html &lt;script src="jquery.js"&gt; &lt;script src="jquery-ui.min.js"&gt; $(document).ready(function() { $("#myTree").treeview(); }); ``` 在...

    jquery插件库(jquery.treeview插件库)

    jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery....

    jquery treeview

    结合这些文件，我们可以构建一个完整的流程：在`Default.aspx`或`async.htm`中，先引入jQuery和Treeview的JavaScript文件，然后在后台代码中（如`Default.aspx.cs`）处理数据库查询，将数据转换成适合Treeview的格式...

    jQuery Treeview异步树实现

    在这个异步树实现中，我们专注于如何在jQuery Treeview中集成异步加载功能，特别是与.NET 3.5及以上版本的后端接口协同工作。 异步加载对于大型数据集至关重要，因为它允许用户逐步加载数据，而不是一次性加载所有...

    jquery TreeView源码实例

    在本文中，我们将深入探讨如何使用jQuery库来创建一个功能丰富的TreeView组件，即树状结构的菜单。jQuery TreeView是一个流行的插件，它允许开发者轻松地将数据组织成层次结构，通常用于展示文件系统、目录结构或者...

    jQuery-Treeview.js v1.4 官方版.rar

    在项目中使用jQuery Treeview.js 首先需要引入jQuery库和treeview插件的JS及CSS文件。你可以通过在HTML文件头部添加以下代码来完成这一步： ```html &lt;link rel="stylesheet" href="jquery.treeview.css" type="text...

    Jquery TreeView结合.NET用户控件的树

    总结，Jquery TreeView与.NET用户控件的结合提供了一种强大且灵活的方式来在ASP.NET应用中展示和操作层次结构数据。通过理解这两个技术的工作原理和结合方式，开发者可以创建出既美观又实用的界面组件。记住，关键...

    jquery treeview树控件.zip

    在本文中，我们将深入探讨 jQuery Treeview 的核心概念、功能特性以及如何在实际项目中有效利用它。 首先，理解 jQuery Treeview 的基本工作原理至关重要。该插件通过将 HTML 的无序列表（ul 和 li 元素）转化为可...

    tree控件 jquery treeview

    在提供的文件列表中，`PrivilegeGroupAction.java`可能是处理权限分组的后台代码，`setPrivilegeUI.jsp`可能负责渲染前端页面，其中包含用于生成`treeview`的HTML结构和JavaScript代码。`jzaefferer-jquery-treeview...

    jquery.treeview.zip

    2. 初始化Treeview：在文档加载完成后，使用jQuery选择器找到要转换的列表，并调用`treeview`方法。 ```javascript $(document).ready(function() { $("#treeview").treeview(); }); ``` 四、配置选项与事件 ...

    jquery.treeview.rar

    《jQuery Treeview插件详解与应用实践》 在Web开发领域，jQuery库以其简洁的API和强大的功能，...无论是在小型项目还是大型应用程序中，jQuery Treeview都是一个值得信赖的工具，帮助我们以优雅的方式管理层次化信息。

    jquery实现的一个treeview效果

    在这个例子中，`#myTree`是我们的目标元素，当页面加载完成，通过`$(document).ready()`函数确保jQuery已经加载完毕，然后调用`.treeview()`方法将其转换为TreeView。 4. **事件处理**：TreeView还支持多种事件，如...

    Jquery TreeView 树形插件

    在项目中使用jQuery TreeView，首先需要确保已引入jQuery库。接着，将`jquery.tree.css`和`jQuery.tree.old.css`这两个CSS文件引入到HTML文档的`&lt;head&gt;`部分，它们分别提供了样式支持和旧版本的样式。同时，将`js`...

    动态树的管理程序(基于jQuery Treeview实现)

    在项目中经常会用到tree，例如分类，用户组等等。 在实现的时候也会有很多的方法，例如可以用extjs，jquery treeview等一些js开发包。 但是在开发的时候我种想找个例子来参考下，发现有很多这样的例子，包括extjs和...

    jquery treeview实例

    在jQuery Treeview中，我们首先需要在HTML中创建一个基础的无序列表，每个列表项代表树中的一个节点。例如： ```html &lt;ul id="treeview"&gt; &lt;!-- 节点将在运行时由Ajax填充 --&gt; ``` 接着，我们需要引入jQuery库...

    Jquery TreeView拖拽树

    本文将深入探讨如何在jQuery TreeView中实现拖拽树的功能。 ### jQuery TreeView基础 jQuery TreeView是jQuery UI的一部分，它为HTML的无序列表（`&lt;ul&gt;`）提供了一种转换为可交互树形视图的方法。通过简单的CSS...

    Jquery TreeView支持大数据加载树

    在标题“Jquery TreeView支持大数据加载树”中，重点在于它能够处理大量数据，这通常涉及到异步加载或分页技术，以优化用户体验和提高性能。 jQuery TreeView的基本使用包括以下几个关键知识点： 1. **安装与引入*...

    jquery-treeview

    - **jQuery treeview.mht**: 这个文件可能包含了一个关于jQuery Treeview的基础示例，演示如何在实际项目中使用该插件。 - **jQuery async treeview.mht**: 这个文件可能涉及了异步加载节点的实现，对于大型数据集...

Magicbox
Global site tag (gtag.js) - Google Analytics