------------------------------------------------------------------------HTML---------------------------------------------------------------------
<tree:comboTree displayValue="--无上级行政区--" value="-1"
treedata="${dataLst}" comboTreeId="name" style="width:153"></tree:comboTree>
treedata="${dataLst}":对应获得后台的数据
displayValue:对应数据的NAME
value: 对应数据ID
comboTreeId="name" 代表的是生成树状后INPUT的NAME属性的值 ,ID的值 以便提交后台获取
树状的原理是根据id name parent_id 来分段的
-------------------------------------------------------------后台-------------------------------------------------------------------------
首先新建bean树类TreeBean。java
package com.company.util.tree;
import java.util.Set;
/**
*
* 类名称:TreeBean
* 类描述:树形类(用于定义树形的基本结构,以供其它类进行转换)
* 创建人:vigo
*/
public class TreeBean {
private String id;
private String name;
private String parentid;
private String url;
private String param1;//备用字段
public String getParam1() {
return param1;
}
public void setParam1(String param1) {
this.param1 = param1;
}
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getParentid() {
return parentid;
}
public void setParentid(String parentid) {
this.parentid = parentid;
}
public String getUrl() {
return url;
}
public void setUrl(String url) {
this.url = url;
}
}
------------------------------------------------------action中查询SQL表数据--------------
List<TreeBean> dataLst =useAmAppFormulaService.findBdExpertItem(false);
TreeBean def=new TreeBean();
def.setId("-1");
def.setName("请选择商品品目");
def.setParentid("");
dataLst.add(def);
request.setAttribute("dataLst",dataLst);
---------------------------------service实现类------------------------此处,我的项目用的是S2SH框架,在后台取得数据时对应自己的取数据的写法
/**
* 查询商品品目树
* @throws 如果Dao层操作失败会抛出异常
* @return 查询的所有结果集
*/
public List<TreeBean> findBdExpertItem(boolean setXzqhTreeHead) throws Exception{
StringBuilder hql = new StringBuilder("select t.id,t.name,t.parent_id from BdExpertItem as t where 1=1 ");
List<Object> list=useAmAppFormulaDao.findBdExpertItem(hql.toString(), null);
List<TreeBean> xzqhTree = new ArrayList<TreeBean>();
for(Object obj:list){
Object[] arr=(Object[]) obj;
TreeBean t = new TreeBean();
t.setId(arr[0].toString());
t.setName((String) arr[1]);
if(arr[2]!=null){
t.setParentid(arr[2].toString());
}else{
t.setParentid("");
}
xzqhTree.add(t);
}
if(setXzqhTreeHead){
TreeBean xzqhhead = new TreeBean();
xzqhhead.setId("-1");
xzqhhead.setName("请选择商品品目");
xzqhhead.setParentid("");
xzqhTree.add(xzqhhead);
}
return xzqhTree;
}
----------------------------------------------dao实现---------------------
/**
* 通过HQL进行完全条件查询
* @param hql HQL条件查询语句
* @param values 条件查询�?
* @throws Dao层操作失败会抛出异常
* @return 条件查询的所有结果集
*/
public List<T> findBdExpertItem(String hql, Object[] values)
throws Exception {
return (List<T>) this.findByQuery(hql, values);
}
----------------------------------此处结束-------------
注意在编辑页面要取得已保存的ID NAME,可以使用,要保存NAME就要在页面取得getText,然后赋值给INPUT
1,直接获取:
单选:$("#id").combotree("getValue")
多选:$("#id").combotree("getValues")
注意:如果value中的值和所显示的文本不同,如需获取文本内容,则可以使用getText(),多选同样加s。
2,在选择事件中获取:
onSelect:function(node){
node.text;或者 node.id;
}
3,使用api中方式
var t = $("#id").combotree('tree'); // 得到树对象
var n = t.tree('getSelected'); // 得到选择的节点
alert(n.text);
4,也可以使用循环的方式获取