一.Ext.tree.panel 继承了 Ext.panel.Table 事件为:itemclick
1.1
tree node 的单击事件,看到 Ext.data.Model record 在这里你可以理解为NodeInterface的实现,所以可以用model直接appednChild
1.2 定义数据源 继承TreeStore
reader的root属性:表示从哪读取数据, 默认为'children',
需要放在proxy中配置。
nodeParam: 发送请求时的参数名字,默认为
'node'
store 里面存在的每一个节点 都是一个model。
二、间隔时间 调用tree节点
itemclick:function(tree,record, item,index, e,eOpts){ //1.添加树的子节点 record.appendChild({ text:'test1', leaf:true }); //2.添加树的前个兄弟节点 record.previousSibling.appendChild({ text:'test1', leaf:true }); }
Ext.define('LP.store.WestTreeStore',{ extend: 'Ext.data.TreeStore', proxy: { type: 'ajax', url: extPath+'/layout!tree.action', reader:{ type:'json', root: 'data', totalProperty: 'totalCount' }, api:{ update:extPath+'/layout!tree.action' }, extraParams:{times:1} }, fields:[ {name:'text', type:'string'}, {name:'count', type:'int'}, {name:'id', type:'int'}, {name:'leaf', type:'boolean'} ], nodeParam:"nodeId", root:{ id:-1, text:'root', leaf:false, expanded:true }, sorters:[{ property:"id", direction:"asc" }] })
loadMenu:function(view,record, item,index, e,eOpts){
var url = Ext.getCmp('west-tree').getStore().getProxy().api['update'];
var i = Ext.getCmp('west-tree').getStore().getProxy().extraParams.times+1
//如果不是叶子 执行加载
if(!record.get('leaf')){
var node = Ext.getCmp('west-tree').getStore().getNodeById(record.get('id'));
var nodeArray = [] ;
var flag;
if(!node.isExpanded()){
node.expand();
flag = window.setInterval(function(){
this.ajaxRequestTree(record,url);
} , 500 );
ajaxRequestTree = function(record,url){
Ext.Ajax.request({
url: url,
params:{nodeId:record.get('id'),times:i++},
method : 'post', //方法,
timeout:4000,
callback : function(options, success, response) {
var obj = Ext.JSON.decode(response.responseText);
if(obj.totalCount == 'end'){
window.clearInterval(flag);
record.appendChild(nodeArray);
return false;
}else{
var totalCount = obj.totalCount;
var datas = obj.data;
nodeArray.push(datas);
/*Ext.each(datas,function(data){
record.appendChild(data);
})*/
}
}
});
}
record.updateInfo();
}else{
node.collapse();
}
}
//this.GridUtil.createTabPanel(record);
}
/** * * 获得左侧树节点 * * @return String */ public String tree(){ HttpServletRequest request = ServletActionContext.getRequest(); HttpServletResponse response = ServletActionContext.getResponse(); String result = request.getParameter("nodeId"); oplogE.debug("*****************"+request.getParameter("nodeId")); if("-1".equals(request.getParameter("nodeId"))){ result = "{\"totalCount\":200,data:[" + "{text:\"总公司1\",count:20,id:100,leaf:false}," + "{text:\"总公司2\",count:80,id:120,leaf:false}]" + "}"; }else if("100".equals(request.getParameter("nodeId"))){ result = "{\"totalCount\":200,data:[" + "{text:\"我的总公司1--分公司1\",count:20,id:1110,leaf:true}," + "{text:\"我的总公司1--分公司2\",count:80,id:1111,leaf:true}]" + "}"; }else if("120".equals(request.getParameter("nodeId"))){ /*result = "{\"totalCount\":200,data:[" + "{text:\"总公司2--分公司1\",count:20,id:1210,leaf:true}," + "{text:\"总公司2--分公司2\",count:80,id:1211,leaf:true}]" + "}";*/ int times = 1; if(request.getParameter("times") != null){ times = Integer.parseInt(request.getParameter("times")); System.out.println("times===================="+times); } if(times >= 10){ result = "{\"totalCount\":'end',data:''}"; }else{ int begin = (times - 1)* 10; int end = begin + 10; List items = new ArrayList(); for(int i=begin;i<end;i++){ User user = new User(); user.setText("总公司"+i+"--分公司"+i); user.setCount(1000+i); user.setId(1000+i); user.setLeaf(true); items.add(user); } JSONArray jsonArray = JSONArray.fromObject( items ); result = "{\"totalCount\":2000,data:" + jsonArray + "}"; } } try { response.setCharacterEncoding("utf-8"); oplogE.debug("设置字符编码是 utf-8 "); response.getWriter().write(result); } catch (IOException e) { e.printStackTrace(); } return null; }