easy_ui之创建异步树（三）

在（一）中的框架基础上，在west的部分添加异步树：

<ulid="menuTree"class="easyui-tree"></ul>

然后配置其节点的数据加载：

<script>

   $(function() {

      //创建tab标签页

      functionaddTab(title, url, id) {

          if($('#tt').tabs('exists', title)) {

             $('#tt').tabs('select', title);

          }else {

             varcontent ='<iframe scrolling="auto" frameborder="0"  src="'

                   + url +'" style="width:100%;height:100%;"></iframe>';

             $('#tt').tabs('add', {

                title : title,

                content : content,

                closable :true

             });

          }

      };

      $('#menuTree')

             .tree(

                   {

                      url :"${ctp}/treeInit",//向后台传送id,获取根节点   

                      lines :true,

                      /* iconCls : "${ctp}/common/pictures/database.gif", */

                      //节点点开前触发 

                      onBeforeExpand :function(node) {

                         $('#menuTree').tree('options').url = "${ctp}/treeControl?pid="

                                + node.pid+"&flag="+node.flag+"&url="+node.url+"&text="+node.text;

                      },

                      //返回过滤过的数据进行展示，这里返回的数据作为点开节点的子节点 

                      loadFilter :function(data) {

                          if(data.msg) {

                             returndata.msg;

                          }else {

                             returndata;

                          }

                      },

                      onClick :function(node) {

                          //如果节点有url属性，则打开一个标签页 

                          if(node.url !=null) {

                             addTab(node.text, node.url, node.id);

                          }

                      }

                   });

   });

</script>

其中loadFilter方法是用来加载树的节点，而addTab方法是用来添加tab标签页的。

其中url配置的是树节点的查询语句，可自行设计，？后面的是传递的参数，也可根据需求进行删减。

下面是我的controller里的对应方法：

package com.kunlun.control;@Controllerpublic class TreeControl {    @Autowired    private TreeService treeService;    @RequestMapping(value = "/treeInit", produces = { "application/json;charset=UTF-8" })    @ResponseBody    public String findRoot(HttpServletRequest req, HttpServletResponse resp) {        return treeService.findRoot();    }    @RequestMapping(value = "/treeControl", produces = { "application/json;charset=UTF-8" })    @ResponseBody    public String findAllNodes(HttpServletRequest req, HttpServletResponse resp) {        String id = req.getParameter("id");        int flag = Integer.valueOf(req.getParameter("flag")).intValue();        String url = req.getParameter("url");        String text=req.getParameter("text");        return treeService.findAllNodes(flag,url,id,text);    }}

service层的sql省略