EASYUI

easyUI学习笔记

• easyUI学习必备 easyUI组件 和 easyUI API 官网或者csdn下载
• esayui组件的导入顺序不可以改变，因为插件的使用是依赖上一个插件，导致效果出不来
• 使用Jquery Easy UI要导入的js顺序

<1>.引用Jquery的Js文件

<2>.引用Easy UI的Js文件

<3>.导入Easy UI的主题Css文件

<4>.导入Easy UI的图标Css文件

<5>.引用Easy UI的国际化文件 以下为让它显示中文

<6>.页面上加上UTF-8编码 防止jquery.easyui.min.js 内容乱码

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

---

1 layout布局

2. 使用完整页面创建布局

2 Menu菜单

   
    
New
   
    
   
        Open   
        
   
            
Word
   
            
Excel
   
            
PowerPoint
   
        
   
    
   
    
Save
   
    
   
    
Exit
   
  

3 tabs选项卡

   
    
   
        tab1    
    
   
    
   
        tab2    
    
   
    
   
        tab3    
    
   
  

4 jsp页面和后台交互的核心代码

public class MenuDao extends JsonBaseDao{
	/**
	 * 查询后台所需要展示的菜单表
	 * 该数据转换成json对象，是不符合esayui组件展示的json格式
	 * @param paramap
	 * @param pageBean
	 * @return
	 * @throws SQLException 
	 * @throws IllegalAccessException 
	 * @throws InstantiationException 
	 */
	public List> menuList(Map prameMap,PageBean pageBean) throws InstantiationException, IllegalAccessException, SQLException{
		String Menuid = JsonUtils.getParmeMap(prameMap, "Menuid");
		String sql ="select * from t_easyui_menu where 1=1";
		if(StringUtils.isNotBlank(Menuid)) {
			sql +=" and parentid = "+Menuid;
		}else {
			sql +=" and parentid = -1";
		}
		return super.executeQuery(sql, pageBean);
		}
	
		
			/**此时数据库查出来的数据是不能展示在页面然后通过此方法转成即可展示的
	/
	public void mapToTreeNode(Map map, TreeNode treeNode) throws InstantiationException, IllegalAccessException, SQLException {
		treeNode.setId(map.get("Menuid").toString());
		treeNode.setText(map.get("Menuname").toString());
		treeNode.setAttributes(map);
		/*
		 * 当前节点的id当做父id
		 */
		Map prameMap = new HashMap<>();
		prameMap.put("Menuid", new String[] {treeNode.getId()});
		List> menuList = this.menuList(prameMap, null);
		List treeNodeList = new ArrayList<>();
		mapListToTreeNodeList(menuList, treeNodeList);
		treeNode.setChildren(treeNodeList);
		
	}
	

	
	public void mapListToTreeNodeList(List> list,List treeNodeList ) throws InstantiationException, IllegalAccessException, SQLException {
		 TreeNode treeNode = null;
		 for (Map map : list) {
			 treeNode = new TreeNode();
			 mapToTreeNode(map, treeNode);
			 treeNodeList.add(treeNode);
		}
	}
	
	/**
	 * 此方法的返回值，才是easyUi的格式
	 * @param prameMap
	 * @param pageBean
	 * @return
	 * @throws InstantiationException
	 * @throws IllegalAccessException
	 * @throws SQLException
	 */
	public List menuTreeList(Map prameMap,PageBean pageBean) throws InstantiationException, IllegalAccessException, SQLException{
		List> menuList = this.menuList(prameMap, null);
		List treeNodeList = new ArrayList<>();
		mapListToTreeNodeList(menuList, treeNodeList);
		return treeNodeList;
		
	}