Ext 三态 复选树

这个东西总会用到，可是开发起来甚是麻烦，下面是我做的，当然也参考了网友的作品。

参考文章：http://blog.csdn.net/weil001/article/details/4008016

 

根据自己的业务，角色分配菜单，改造如下：

1.选择一个角色弹出如下界面：

 

复选树代码在src.rar中

 

2.js代码调用

var roleId = record.get('roleId');// 选择角色的ID
var menuTree = new Ext.sys.CheckMenuTree({ roleId: roleId });

 

var win = new Ext.Window({
      title: '角色授权', width:600,height:400,
      modal: true, resizable: true, layout: 'fit',
      items: [menuTree],
      buttonAlign: 'center',
      buttons: [{
             text:'确定', iconCls:'icon_ok',
             handler: function(){
              var ids = menuTree.getCheckedNodes();// 被选中的树节点-json串形式
              alert(ids );

             // 自己业务代码

 

             //
             }
      }, '-', {
       text:'关闭', iconCls:'icon_cancle', handler: function(){ win.close(); win = null; }
   }]
  });
  win.show();

 

3.表结构

 

4.后台实现

/**
  * 描述：listMenu4CheckBox 菜单复选框树-查看所有
  * @param request
  * @return
  * @CreateOn Jul 19, 2011  4:06:33 PM
  * @author chun_chang
  * @throws Exception
  */
 public List<Map<String, Object>> listMenu4CheckBox(HttpServletRequest request) throws Exception{
  String sql = "";
  String roleId = request.getParameter("roleId");
  // 1.提取当前角色下的所有的菜单ID
  sql = "from cs_role_menu_map where roleId = ?";
  String[] fields = { "menuId", "status" };
  List<Map<String, Object>> listMenuId = this.menuDao.queryForListMap(fields, sql, new Object[] { roleId });

  Map<String, String> statusMap = new HashMap<String, String>();
  for(Map<String, Object> map2: listMenuId) {
   statusMap.put(String.valueOf(map2.get("menuId")), String.valueOf(map2.get("status")));
  }
  
  // 2.取出所有菜单
  sql = "select menuId, menuName,iconCls from cs_menu where parentMenuId = 0 order by menuId";
  return this.subListMenu("0", statusMap);
 }
 
 private List<Map<String, Object>> subListMenu(String pid, Map<String, String> statusMap) throws Exception{
  String sql = "select menuId, menuName,iconCls from cs_menu where parentMenuId = ? order by orderNum";
  List<Map<String, Object>> list = menuDao.getJdbcTemplate().query(sql, new Object[]{pid}, new RowMapper<Map<String, Object>>(){
   
   public Map<String, Object> mapRow(ResultSet rs, int rowNum) throws SQLException {
    Map<String, Object> map = new HashMap<String, Object>();
    map.put("id", rs.getString("menuId"));
    map.put("text", rs.getString("menuName"));
    map.put("iconCls", rs.getString("iconCls"));
    map.put("checked", "none");
    return map;
   }
   
  });
  for(Map<String, Object> map: list){
   String menuId = String.valueOf(map.get("id"));
   List<Map<String, Object>> list1 = this.subListMenu(menuId, statusMap);
   map.put("children", list1);
   
   String status = statusMap.get(menuId);// status的值为none,part,all-分别对应图片none.gif，part.gif，all.gif
   if(StringUtils.isNotBlank(status)){
    map.put("checked", status);
   }
  }
  return list;
 }