extjs input框带树的开发

var comboxWithTree_sys = new Ext.form.ComboBox({  
id:'comboxWithTree_sys',
labelAlign:'left',
    fieldLabel:"所属层级",
    //columnWidth:.33,
   // labelWidth: 80,
    hiddenName:'entity.cuseDept',
    labelStyle : "text-align:right",
    store:new Ext.data.SimpleStore({fields:[],data:[[]]}),  
    editable:false, 
    //allowBlank : false,
    mode: 'local',  
    triggerAction:'all',  
    maxHeight: 300,
    //width : 150, 
    tpl: "<tpl for='.'><div style='height:300px'><div id='tree_div_sys'></div></div></tpl>",  
    selectedClass:'',  
    onSelect:Ext.emptyFn, 
    listeners :{
"afterrender":function(combo,t,o){
var syscom = this;
    this.onViewClick = function(doFocus) {
var index = this.view.getSelectedIndexes()[0], s = this.store, r = s.getAt(index);
if (r) {
this.onSelect(r, index);
} else if (s.getCount() === 0) {
this.collapse();
}
if (doFocus !== false) {
this.el.focus();
}
};
}
}
});

comboxWithTree_sys.on('expand',function(){  
    tree_sys.render('tree_div_sys');
tree_sys.expandAll();
});
var tree_sys = new Ext.tree.TreePanel({
id : "tree_sys",
autoHeight : true,
border : false,
columnWidth : .25,
lines : true,
dataUrl:jsContextPath+'/command/commandDwms.do?opCommand=showTree&m=getTreeDate',   //&type=getId',
//dataUrl :jsContextPath+'/command/commandDqmp.do?opCommand=doSysShowManager&treeflag=1&operdanweiid='+operdanweiid,
root : {
nodeType : 'async',
text : '所属层级',
draggable : false,
id : '0'
}
});
tree_sys.on('click',function(node){  
    comboxWithTree_sys.setValue(node.text); 
form.getForm().findField('cellid').setValue(node.id);
comboxWithTree_sys.collapse();
});



           var form = new Ext.form.FormPanel({
region:'north',
id:'fileUploadForm',
title:'查询条件',
height:150,
//border:false,
monitorResize :true,
frame:true,
labelWidth:80,
layout:'column',
items:[{layout : "form",
width:250,
items : [comboxWithTree_sys]}]
                                         });

         //url返回的数据应该是
    [{"cls":"file","description":"","expandable":false,"href":"","hrefTarget":"","id":"41","leaf":true,"text":"CIM层模型"},{"cls":"file","description":"","expandable":false,"href":"","hrefTarget":"","id":"42","leaf":true,"text":"DW层模型"},{"cls":"file","description":"","expandable":false,"href":"","hrefTarget":"","id":"43","leaf":true,"text":"ETL编写"},{"cls":"file","description":"","expandable":false,"href":"","hrefTarget":"","id":"44","leaf":true,"text":"数据库设计"}]

      java  pojos类
   
    package gzkit.dwms.modelmanager;

/**
* 定义一棵树的节点信息POJO
* @author lizhenbin
*
*/
public class TreeNode {

private String id;
private String text; //节点名称
private boolean leaf; //是否叶子
private String cls; //图标
private String href; //链接
private String hrefTarget; //链接指向
private boolean expandable; //是否展开
private String description; //描述信息

public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getText() {
return text;
}
public void setText(String text) {
this.text = text;
}
public boolean isLeaf() {
return leaf;
}
public void setLeaf(boolean leaf) {
this.leaf = leaf;
}
public String getCls() {
return cls;
}
public void setCls(String cls) {
this.cls = cls;
}
public String getHref() {
return href;
}
public void setHref(String href) {
this.href = href;
}
public String getHrefTarget() {
return hrefTarget;
}
public void setHrefTarget(String hrefTarget) {
this.hrefTarget = hrefTarget;
}
public boolean isExpandable() {
return expandable;
}
public void setExpandable(boolean expandable) {
this.expandable = expandable;
}
public String getDescription() {
return description;
}
public void setDescription(String description) {
this.description = description;



}

}




/**
*  返回数据的方法
* @param paramMap
* @param config
* @return
* @throws Exception
*/
public Object getTreeDate(Map paramMap, CommandConfig config)
    throws Exception
    {
String jsoStr="";
List list=modelMgrService.getData();
List dataList=new ArrayList();
for (int i = 0; i < list.size(); i++) {
//TreeNode treeNode = new TreeNode();


   TreeNode  treeNode=new TreeNode();
Map m=(Map) list.get(i);
BigDecimal objId= (BigDecimal) m.get("OBJ_ID");
treeNode.setId(objId.toString());
String  objName= (String) m.get("OBJ_NAME");
treeNode.setText(objName);
treeNode.setCls("file");                              
treeNode.setLeaf(true);
treeNode.setExpandable(false);
    dataList.add(treeNode);
}
JSONArray  jsoarr=JSONArray.fromObject(dataList);
jsoStr=jsoarr.toString();
ResponseUtils.print(ServletContextHolder.getResponse(), jsoStr);
  return null;
       }


select * from  tb_dictionary  where super_id=8

  数据库结构**********
  obj_id    objName                super_id 
    8         所属层级             0
   41         CIM层模型            8
   42         DW层模型             8 
   43         ETL编写              8               
   44         数据库设计           8          




你可能感兴趣的:(extjs树控件)