前段框架-Jeesite的treeselect

Jeesite封装了众多的前后端框架,极大的提高了开发效率,但是官方文档对于一些封装组件的介绍有时需要费很长时间才能搞明白,应为它没有实例展示,本篇文章就Jeesite的高级表单组件的封装做了一些实例。

最主要 的一个点是:前端框架需要的数据结构是什么样子的,后台需要组织什么样的数据出来,这一点,官方文档没有提后台的数据结构。稍微扒一扒它的源码,就能知道要什么样的数据了。

重点介绍第一个组件,应为如果对于没有用过ztree的人来说,这个自定义的树很难显示出来!!因为我之前用过ztree,所以知道ztree形成必需的几个变量id,pId,name 节点id,节点父id,节点名字,

Jeesite集成了ztree,所以这三个值必须要有才能组织处ztree

如果你去扒他的测试例子,你会发现这个有什么MapperException,Extend等等这些在往Map里赋值,我也是误打误撞突然想起ztree需要的三个元素,索性一,成功了:

前端:

<#form:treeselect id="mytree" title="這是一個樹"
name="myTree.id"  labelName="myTree.name"
url="${ctx}/mytest/mytest1/getTree"
class="" allowClear="true" canSelectRoot="true" canSelectParent="true"/>

后端:

组织出树要的数据结构,他需要的是一个List<Map<String,Object>>这种的:

controller里的方法:

@Controller
@RequestMapping(value = "${adminPath}/mytest/mytest1")
public class TestController1 extends BaseController {
/**
     * 结构树  和ztree結合id pId name
     */
    @RequestMapping(value = {"getTree", ""})
    @ResponseBody
    public List<Map<String, MyTreeEntity>> tree(HttpServletRequest request, HttpServletResponse response) {
        System.out.println("测试test1请求到后端树");
        List list = ListUtils.newArrayList();

        MyTreeEntity se1=new MyTreeEntity();
        se1.setId(0);
        se1.setCode("001");
        se1.setParentCode("0");
        se1.setName("樹的節點1");

        MyTreeEntity se2=new MyTreeEntity();
        se2.setId(1);
        se2.setCode("002");
        se2.setParentCode("");
        se2.setName("樹的節點2");

        MyTreeEntity se3=new MyTreeEntity();
        se3.setId(2);
        se3.setCode("001001");
        se3.setParentCode("001");
        se3.setName("樹的節點1-1");


        HashMap a1 = MapUtils.newHashMap();
        a1.put("id",se1.getCode());
        a1.put("pId",se1.getParentCode());
        a1.put("name",se1.getName());

        HashMap a2 = MapUtils.newHashMap();
        a2.put("id",se2.getCode());
        a2.put("pId",se2.getParentCode());
        a2.put("name",se2.getName());


        HashMap a3 = MapUtils.newHashMap();
        a3.put("id",se3.getCode());
        a3.put("name",se3.getName());
        a3.put("pId",se3.getParentCode());

        list.add(a1);
        list.add(a2);
        list.add(a3);

        return list;
    }
}

MyTreeEntity是自己随意建的一个实体:

package com.jeesite.modules.mytest.entity;

public class MyTreeEntity {
    private int id;
    private String code;
    private String parentCode;
    private String name;

    public int getId() {
        return id;
    }

    public void setId(int id) {
        this.id = id;
    }

    public String getCode() {
        return code;
    }

    public void setCode(String code) {
        this.code = code;
    }

    public String getParentCode() {
        return parentCode;
    }

    public void setParentCode(String parentCode) {
        this.parentCode = parentCode;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }
}

前端显示:

点击

 

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值