04-easyui-tree左侧菜单开发（6课时 2018-02-18）

在线网址

第一部分 navtree (3课时)#

相关工程：springmvc-mb
http://www.miniui.com/demo/#src=datagrid/celledit.html

可点击右上角api手册下载离线eclipse java工程

1)定位到页面tree/navtree.html把他cp到我们工程里。
2)把依赖js css fonts找出来，放到工程里。
springmvc-mb下的 css js data resource文件夹
3）springmvc.xml里配置静态资源访问权限

3）启动工程，调bug
http://localhost:8081/spring-mb/admin/menulist

注意：listTree.txt数据结构

第2部分 (3课时)#

快速入门之CRUD

我选择了第6个数据绑定

第一个功能：列表功能

1)定位demo页面databinding/databinding.html

列表：/data/AjaxService.jsp?method=SearchEmployees
2)改成databinding.jsp,并载入js和css
3)研究demo/data/grid.txt得到返回数据的格式

{
"total": 55931,
"data": [{
"city": "",
"age": 25,
"gender": 1,
"dept_id": "js",
"email": "[email protected]",
"position_name": "前端工程师",
"salary": "3860",
"createtime": "2012-01-31T13:28:34",
"school": "宁波工程大学",
"name": "谢忠哲",
"educational_name": "本科",
"married": 0,
"educational": "2",
"id": "d6fb5410-adde-46a9-9d2b-dee99c64a83d",
"birthday": "1987-10-22T00:00:00",
"country": "fr",
"position": "js3",
"loginname": "[email protected]",
"remarks": "332",
"dept_name": "技术部"
},
......
}

4)在后台制作一个实体类grid.java

package com.neuedu.pojo;

public class Grid {
    private String city;
    private int age;
private int gender;
private String  dept_id;
    private String  email;
    private String  position_name;
    private String  salary;
    private String  createtime;
    private String  school;
    private String  name;
    private String  educational_name;
    private String  married;
    private String  educational;
    private String  id;
    private String  birthday;
    private String  country;
    private String  position;
    private String  loginname;
    private String  remarks;
    private String  dept_name;
    ......省略get/set
}

5)制作controller用于测试数据绑定

 @RequestMapping("/admin/gobind")
  public String gobind(){
      
      return "databinding";
  }
  @RequestMapping("/admin/databind")
  public @ResponseBody Map databind(){
      List glist=new ArrayList<>();
      Grid g=new Grid();
      g.setName("wang.qj");
      g.setLoginname("wqj");
      g.setGender(2);
      //g.setBirthday(birthday);
      glist.add(g);
      Map m=new HashMap();
      m.put("total", 50);
      m.put("data", glist);
      return m;
  }

6）修改databinding.jsp

原来代码为：

修改为：