继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

zTree结合servlet简单使用

ajax入门学习视频
关注TA
已关注
手记 266
粉丝 80
获赞 597

前台代码:

1、html部分

<div >
    <ul id="knowledgeTree" class="ztree"></ul>
</div>

2、js部分代码:

$knowledgeTree ="";
   var setting = {
    check: {
    enable: false,       //显示复选框或者radio
    chkStyle: "checkbox",     //复选框或者radio
    chkboxType: { "Y" : "ps", "N" : "ps" } //控制关系
    },
    view: {
     selectedMulti: false, //true/false分别表示 支持/不支持 同时选中多个节点
     showTitle: true,  //true/false 分别表示 显示 /隐藏 提示信息(即鼠标移动到节点上时,自动弹出的提示信息图层)
     showIcon:false
    },
    data: {
     key: {
      name: "name",  //设置 zTree 显示节点名称的属性名称
      title: "title"  //设置 显示节点提示信息的属性名称。[setting.view.showTitle = true 时生效]
     },
     simpleData: {
      enable: true,  //是否使用简易JSON格式数据(非父子结构)
      idKey: "id",  //设置 zTree 显示节点名称的节点名称
      pIdKey: "pid",  //设置 zTree 简易数据的父节点名称
      rootPId: "-1"  //最上层父节点
     }
    },
    callback: {
     onClick: onClick
    }
  };

jQuery(document).ready(function(){
     $.ajax({
    url : localBasePath + "/servlet/KnowledgeToolServlet",
    type : "post",
    dataType : "json",
    success : function(dataObj) {
         $knowledgeTree = $.fn.zTree.init($("#knowledgeTree"), setting, dataObj);
    }
   });
  });

 

3、servlet部分代码:

public void doPost(HttpServletRequest request, HttpServletResponse response)
   throws ServletException, IOException {

response.setContentType("text/html");
  response.setCharacterEncoding("utf-8");
  PrintWriter out = response.getWriter();

KnowledgeService ks=new KnowledgeService();

List<TreeNode> treeNodeList=ks.searchKonwldgeTree();

String treeNodeJson = JSONSerializer.toJSON(treeNodeList).toString();
 out.print(treeNodeJson);

  out.flush();
  out.close();
 }

其中KnowledgeService.searchKonwldgeTree()代码如下:

//查询知识库树
 public List<TreeNode> searchKonwldgeTree() {
  StringBuffer sql = new StringBuffer();
  Connection conn = null;
  Statement stmt = null;
  List<Knowledge> knowlList = new ArrayList<Knowledge>();
  List<TreeNode> treeNodeList = new ArrayList<TreeNode>();
  ResultSet rs = null;
    try {
   conn = newdom.getConnection();
   stmt = conn.createStatement();
   conn.setAutoCommit(false);
   sql.append(" select skl.knowid, skl.usedoctype,sed.typename,skl.knowname,skl.knowtext from SBL_KNOWLEDGE_LIB skl,SZD_EMR_DOCTYPE sed ";

   sql.append(" order by skl.usedoctype ");
   System.out.println(sql.toString());
   rs = stmt.executeQuery(sql.toString());
   while (rs.next()) {
    Knowledge knowledge=new Knowledge();
    knowledge.setId(rs.getString("knowid"));
    knowledge.setName(rs.getString("knowname"));
    knowledge.setDocType(rs.getString("usedoctype"));
    knowledge.setDocTypeName(rs.getString("typename"));
    knowledge.setContent(rs.getString("knowtext"));
    knowlList.add(knowledge);
   }
  } catch (Exception ex) {
   log.error("查询知识库树错误");
   ex.printStackTrace();
  } finally {
   newdom.close(conn, stmt, rs);
  }
  String typeTemp="";
  for(Knowledge knowledge:knowlList){
   TreeNode treeNode = new TreeNode();
   if(!knowledge.getDocType().equals(typeTemp)){
    TreeNode treeNodeParent = new TreeNode();
    treeNodeParent.setId(knowledge.getDocType());
    treeNodeParent.setName(knowledge.getDocTypeName());
    treeNodeParent.setIsParent("true");
    treeNodeParent.setChecked("true");
    treeNodeParent.setOpen("false");
    treeNodeParent.setPid("-1");
    treeNodeParent.setTitle(knowledge.getDocTypeName());
    treeNodeList.add(treeNodeParent);
   }
   typeTemp=knowledge.getDocType();
   treeNode.setId(knowledge.getId());
   treeNode.setName(knowledge.getName());
   treeNode.setTitle(knowledge.getName());
   treeNode.setContent(knowledge.getContent());
   treeNode.setChecked("true");
   treeNode.setOpen("true");
   treeNode.setIsParent("false");
   treeNode.setPid(knowledge.getDocType());
   treeNodeList.add(treeNode);
  }
  return treeNodeList;
 }

 

大致代码如上,实现的思路是将要做成树的数据,按照zTree的指定格式,放到一个list里面,本文中树的内容是表SBL_KNOWLEDGE_LIB ,SZD_EMR_DOCTYPE结合的数据,将这些数据从数据库中查出来,然后按照实际需要组装成所需要的List,然后转换成json格式print出就可以了。这样ajax里面接收到返回的json格式的对象后,直接赋值给zTree就完成了一个树的简单实现。

 

打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP