jQuery EasyUI是一组基于jQuery的UI插件集合体，而jQuery EasyUI的目标就是帮助web开发
者更轻松的打造出功能丰富并且美观的UI界面。开发者不需要编写复杂的javascript，也不需要对css
样式有深入的了解，开发者需要了解的只有一些简单的html标签。
1.接触 EasyUI 两天了,对它的方法调用一直是不太理解,比如:
$('#tt').tabs('add',
{
title: 'new tab',
selected: false
//...
});
这是一个选项卡调用它的add方法,乍一看跟java的对象掉方法的思想差别很大,今天再来看,发现
其实就是对象调方法,分析如下:
1. $('#tt')这个是对象,
2. 'add'这个是方法,
3. .tabs这个又算是什么呢?
是这样的,对象还是那个对象,方法还是那个方法,只是在 EasyUI 中它不像java那样对象和方法
之间的联系紧密性那么高,而在 EasyUI 中一个对象调方法,由于对象和方法的联系不够紧密,导致
一个对象调方法时,不能准确知道是调用的那个类的方法,所以就需要指明是哪个类的方法,所以
.tabs 就是指明了后边调的方法是 tabs(选项卡)的方法,这样就解释清楚了 EasyUI 调方法的原理;
2. EasyUI 中的依赖--- "继承";
跟java中的继承对应,EasyUI中提供类的依赖 当A类依赖B类时,A的对象就具有了B类中的方法,这也就
便于功能的扩展;
3. 理解了1. 就明白了对象调方法,
理解了2. 就明白了对象调依赖 父类的方法; 这样在需要一些功能在本类中找不到时,可以尝试从父类中找;
4.功能更强大的树形插件 zTree(不属于easyUI)
1. 将json数据解析成树形结构:(两种json)
1.标准json数据
标准的 JSON 数据需要嵌套表示节点的父子包含关系
例如：
var nodes = [
{name: "父节点1", children: [
{name: "子节点1"},
{name: "子节点2"}
]}
];
默认展开的节点，请设置 treeNode.open 属性
无子节点的父节点，请设置 treeNode.isParent 属性
其他属性说明请参考 API 文档中 "treeNode 节点数据详解
2.简单json数据
简单模式的 JSON 数据需要使用 id / pId 表示节点的父子包含关系，如使用其他属性设置父子关联关
系请参考 setting.data.simple 内各项说明
例如：
var nodes = [
{id:1, pId:0, name: "父节点1"},
{id:11, pId:1, name: "子节点1"},
{id:12, pId:1, name: "子节点2"}
];
5. 使用zTree生成树形结构的步骤:
1. 在html的<body>中给树形结构找一个放置位置: 提供一个<ul>标签
<ul id="tree" class="ztree" style="width:260px; overflow:auto;"></ul>
2. 在js代码中:
1. setting 配置示例:
var setting = {
view: {
dblClickExpand: false,
showLine: true,
selectedMulti: false
},
data: {
simpleData: {
enable:true, //启用简单数据格式;
idKey: "id",
pIdKey: "pId",
rootPId: ""
}
},
callback: { //回掉函数 ,相当于给每一个节点绑定监听
beforeClick: function(treeId, treeNode) {
var zTree = $.fn.zTree.getZTreeObj("tree");
if (treeNode.isParent) {
zTree.expandNode(treeNode);
return false;
} else {
demoIframe.attr("src",treeNode.file + ".html");
return true;
}
}
}
};
2. zNodes 节点配置示例:
var zNodes =[
{id:1, pId:0, name:"[core] 基本功能 演示", open:true},
{id:101, pId:1, name:"最简单的树 -- 标准 JSON 数据", file:"core/standardData"},
{id:102, pId:1, name:"最简单的树 -- 简单 JSON 数据", file:"core/simpleData"},
{id:103, pId:1, name:"不显示 连接线", file:"core/noline"},
{id:104, pId:1, name:"不显示 节点 图标", file:"core/noicon"},
{id:105, pId:1, name:"自定义图标 -- icon 属性", file:"core/custom_icon"},
{id:106, pId:1, name:"自定义图标 -- iconSkin 属性", file:"core/custom_iconSkin"},
{id:107, pId:1, name:"自定义字体", file:"core/custom_font"},
{id:115, pId:1, name:"超链接演示", file:"core/url"},];
3. 生成树形结构:
var t = $("#tree");
t = $.fn.zTree.init(t, setting, zNodes);
1.form插件中 combox的知识点,url:数据获取; valueField:数据接收;textField:显示的值;
<input id="cc" name="dept" value="aa">
$('#cc').combobox({
url:'combobox_data.json',
valueField:'id',
textField:'text'
});
2. form的load方法:
加载记录填表。数据参数可以是一个字符串或一个对象类型,当字符串作为一个远程URL,否则作为一个当地的记录。
代码示例:
$('#ff').form('load','get_data.php'); // load from URL $('#ff').form('load',{
name:'name2',
email:'[email protected]',
subject:'subject2',
message:'message2',
language:5
});
2. datagrid中的load方法的使用;
加载和显示第一页行。如果指定的param”,它将取代与queryParams 的属性。通常一个查询通过一些参数,这种方法可以调用从服务器加载新数据。
$('#dg').datagrid('load',{
code: '01',
name: 'name01'
});
3.root.get("属性名") 获得的是属性的路径path ,这个path是什么?
4. QBC查询出现的价值:
查询语句的生成 用编码的方式来生成,这样带来了一个好处就是最终生成的Sql语句动态化;
简单一句化就是 编码本身的动态化这个特性用到SQL语句的生成,使一些动态查询得到了实现,
不然你要动态查询,单纯用sql语句来实现动态查询,或者从逻辑上难于实现,或者代码量很庞杂;
5.fastjson 中的属性过滤标签:
/*
* 第一种：在对象响应字段前加注解，这样生成的json也不包含该字段。
* @JSONField(serialize=false)
* private String name;
*/
/*
* 第二种：在对象对应字段前面加transient，表示该字段不用序列化，即在生成json的时候就不会包含该字段了。
* private transient String name;
*/
/*
* 第三种：使用fastjson的拦截器
* PropertyFilter profilter = new PropertyFilter(){
@Override
public boolean apply(Object object, String name, Object value) {
if(name.equalsIgnoreCase("last")){
//false表示last字段将被排除在外
return false;
}
return true;
}
};
json = JSON.toJSONString(user, profilter);
System.out.println(json);
*/
/*
* 第四种，直接填写属性
* SimplePropertyPreFilter filter = new SimplePropertyPreFilter(TTown.class, "id","townname");
response.getWriter().write(JSONObject.toJSONString(townList,filter));
*/
6. ocupload one click upload (一键上传)