jsTree插件的应用

最新推荐文章于 2024-06-13 09:33:09 发布

zhaoming262350

最新推荐文章于 2024-06-13 09:33:09 发布

阅读量3.5k

点赞数

分类专栏： jsTree

本文链接：https://blog.csdn.net/zhaoming262350/article/details/12224579

版权

jsTree 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

从服务器端动态的获取数据：

在浏览器页面中：客户端

<html>
   <head>
       <base href="<%=basePath%>">
       <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
       <title>CMS 后台管理工作平台</title>
       <script type="text/javascript" src="js/jquery-1.10.2.js"></script>
       <script type="text/javascript" src="js/jquery.jstree.js"></script>
       <script language="javascript">

   //第二种写法,注意是添加attr
   $(function() {
       //将menuContainer变成一棵树！

   $("#demo").jstree( {
           "json_data" : {
               "ajax" : {

//通过URl从服务器拿到数据
                           "url" : "XXXX.action?method:tree"
                       }
           },
           "plugins" : [ "themes", "json_data" ]
       });
   });
</script>
       <style type="text/css">

</style>
   </head>
   <body>
       <div id="demo">

       </div>
   </body>
</html>
服务器端：

public void tree()
   {
       try
       {
            //添加数据
           Node root = new Node("大学",1,"www.baidu.com");
           root.addChildNode(new Node("办公室",2,"www.csdn.com"));
           root.addChildNode(new Node("学籍科",3,"www.sina.com"));

            //把存储的数据解析存到JSON 中
           String str = JSONMapper.toJSON(root).render(false);
            //设置编码方式
           ServletActionContext.getResponse().setCharacterEncoding("UTF-8");

            //输出到客户端
           ServletActionContext.getResponse().getWriter().print(str);


       } catch (MapperException e)
       {
           e.printStackTrace();
       } catch (IOException e)
       {
           e.printStackTrace();
       }
   }