Extjs下拉列表树形图

//点击用户新增
new Ext.Button({
text:'新增用户',
id:'addUser',
icon:'../../image/user_add.png',
cls:'x-btn-text-icon',
handler:function(){
//清空上次文本框填写的数据
Ext.getCmp('newForm').form.reset();
//弹出模态窗口
win.show();
}
})
//模态窗口
var win = new Ext.Window({
title:'添加用户',
width:350,
height:280,
modal:true,
items:[form]
});
//模态窗口需要填写的字段
//提示信息方式
Ext.QuickTips.init();
//新增用户
var form = new Ext.form.FormPanel({
frame:true,
url:'../../userManager/user_saveUser.action',
id:'newForm',
items:[{layout:'form',items:[{
xtype: 'textfield',
id:'userName_add',
allowBlank : false,
fieldLabel:'用户名称',
blankText : '用户名称不能为空',
width:150
}]},
{layout:'form',items:[{
xtype: 'textfield',
inputType:'password',
id:'password_add',
allowBlank : false,
blankText : '密码不能为空',
regex : /^[\s\S]{0,20}$/,
regexText : '密码长度不能超过20个字符',
fieldLabel:'用户密码',
width:150
}]},
{layout:'form',items:[{
xtype: 'textfield',
inputType:'password',
id:'password_confirm_add',
vtype:"password",//自定义的验证类型
vtypeText:"两次密码不一致！",
confirmTo:"password_add",//要比较的另外一个的组件的id
allowBlank : false,
fieldLabel:'确认密码',
width:150
}]},
{layout:'form',items:[{
xtype: 'textfield',
id:'condition1_add',
allowBlank : false,
blankText : '姓名不能为空',
fieldLabel:'姓名',
width:150
}]},
{layout:'form',items:[{
xtype: 'treeField',
id:'depart_add',
valueField:'id',
fieldLabel: '所属部门',
emptyText:'选择所属部门',
readOnly:true,
allowBlank:false,
blankText:'所属部门部门为空',
listWidth:200,
listHeight:200,
dataUrl:'../../userManager/user_treeList.action',
hiddenName:'depart_add',
width:150
}]},
{layout:'form',items:[{
xtype: 'datefield',
readOnly:true,
id:'birthDate_add',
allowBlank : false,
blankText : '出生日期不能为空',
fieldLabel:'出生年月',
width:150
}]},
{
layout:'form',
items:[{columnWidth:0.2,layout:'form',items:[{
xtype:'radiogroup',fieldLabel : "用户性别", anchor:'70%',columns: 2 ,items:
[{boxLabel: "先生", name: 'cst_sex_add',id:'cst_man_add' ,checked:true,inputValue: 1},
{boxLabel: "女士", name: 'cst_sex_add',id:'cst_woman_add',inputValue: 2}]
}]}
]
}

],
buttons:[{
id:'save',
text:'保存',
handler:function(){
var json = {success:function(){store.reload();win.hide();},failure:function(){}};
form.getForm().submit(json);
}
},{
id:'cancel',
text:'取消',
handler:function(){
win.hide();
}
}
]
});
//userManager/user_treeList.action返回来的数据格式：
[{"childernId":0,"children":[{"childernId":0,"children":[],"cls":"file","expanded":false,"id":150,"leaf":true,"parentId":1,"text":"OBS测试一级目录1"},{"childernId":0,"children":[{"childernId":0,"children":[{"childernId":0,"children":[],"cls":"file","expanded":false,"id":130,"leaf":true,"parentId":129,"text":"OBS管理一级目录3"}],"cls":"folder","expanded":false,"id":129,"leaf":false,"parentId":128,"text":"OBS管理一级目录2"},{"childernId":0,"children":[],"cls":"file","expanded":false,"id":131,"leaf":true,"parentId":128,"text":"OBS管理一级目录4"}],"cls":"folder","expanded":false,"id":128,"leaf":false,"parentId":1,"text":"OBS管理一级目录1"},{"childernId":0,"children":[],"cls":"file","expanded":false,"id":161,"leaf":true,"parentId":1,"text":"OBS测试无状态刷新"}],"cls":"folder","expanded":true,"id":1,"leaf":false,"parentId":0,"text":"三元管理系统OBS"}]

如果此树的深度不确定，则需要使用递归函数进行构造返回的数据。