基于dhtmlxtree实现的下拉树
2013-05-27 16:04
113 查看
下拉树对象代码:
function dhtmlXTreeCombo(id, name){
var _parent = document.getElementById(id);
var _combo = document.createElement("div");
_combo.setAttribute("id", "combo");
_combo.style.width = '150px';
_combo.style.height = '20px';
var _input = document.createElement("div");
_input.align = "right";
var _hidden = document.createElement("input");
_hidden.setAttribute("type", "hidden");
_hidden.setAttribute("name", name);
var _img = document.createElement("img");
//下拉框图标
this.setImage = function(img){
_img.setAttribute("src", img);
}
_img.setAttribute("id", "img");
var _content = document.createElement("div");
_content.setAttribute("id", "content");
_content.style.height = '20px';
_input.appendChild(_img);
_input.appendChild(_hidden);
_combo.appendChild(_content);
_combo.appendChild(_input);
_parent.appendChild(_combo);
var _tree = document.createElement("div");
_tree.setAttribute("id", "treebox"+id);
_tree.style.display = "none";
_tree.style.width = "150px";
_tree.style.height = "100px";
_tree.style.border = "1px solid Silver";
_parent.appendChild(_tree);
var tree=new dhtmlXTreeObject("treebox"+id,"100%","100%",0);
tree.setEscapingMode('UTF-8');
this.setIconsPath = function(path){
tree.setIconsPath(path);
tree.enableTextSigns(true);
}
this.loadTree = function(url){
tree.setXMLAutoLoading(url);
tree.loadXML(url);
}
tree.attachEvent("onClick", function(id){
_content.innerHTML = tree.getItemText(id);
_hidden.value = id;
_tree.style.display = 'none';
});
_img.onclick = function(){
if(_tree.style.display == 'none'){
_tree.style.display = 'block';
} else {
_tree.style.display = 'none';
}
}
}
实例化下拉树代码:
<div id="test" ></div>
<script>
var test = new dhtmlXTreeCombo("test", "testname");
test.setImage("<%=basePath%>image/combo_select_dhx_skyblue.gif");
test.setIconsPath("<%=basePath%>dhtmlx/imgs/csh_bluebooks/");
test.loadTree("<%=basePath%>menu/getChildMenu.action?id=7420");
</script>
function dhtmlXTreeCombo(id, name){
var _parent = document.getElementById(id);
var _combo = document.createElement("div");
_combo.setAttribute("id", "combo");
_combo.style.width = '150px';
_combo.style.height = '20px';
var _input = document.createElement("div");
_input.align = "right";
var _hidden = document.createElement("input");
_hidden.setAttribute("type", "hidden");
_hidden.setAttribute("name", name);
var _img = document.createElement("img");
//下拉框图标
this.setImage = function(img){
_img.setAttribute("src", img);
}
_img.setAttribute("id", "img");
var _content = document.createElement("div");
_content.setAttribute("id", "content");
_content.style.height = '20px';
_input.appendChild(_img);
_input.appendChild(_hidden);
_combo.appendChild(_content);
_combo.appendChild(_input);
_parent.appendChild(_combo);
var _tree = document.createElement("div");
_tree.setAttribute("id", "treebox"+id);
_tree.style.display = "none";
_tree.style.width = "150px";
_tree.style.height = "100px";
_tree.style.border = "1px solid Silver";
_parent.appendChild(_tree);
var tree=new dhtmlXTreeObject("treebox"+id,"100%","100%",0);
tree.setEscapingMode('UTF-8');
this.setIconsPath = function(path){
tree.setIconsPath(path);
tree.enableTextSigns(true);
}
this.loadTree = function(url){
tree.setXMLAutoLoading(url);
tree.loadXML(url);
}
tree.attachEvent("onClick", function(id){
_content.innerHTML = tree.getItemText(id);
_hidden.value = id;
_tree.style.display = 'none';
});
_img.onclick = function(){
if(_tree.style.display == 'none'){
_tree.style.display = 'block';
} else {
_tree.style.display = 'none';
}
}
}
实例化下拉树代码:
<div id="test" ></div>
<script>
var test = new dhtmlXTreeCombo("test", "testname");
test.setImage("<%=basePath%>image/combo_select_dhx_skyblue.gif");
test.setIconsPath("<%=basePath%>dhtmlx/imgs/csh_bluebooks/");
test.loadTree("<%=basePath%>menu/getChildMenu.action?id=7420");
</script>
相关文章推荐
- Sharepoint 2010 Form 身份认证的实现(基于AD)
- 基于MogileFS+mysql+nginx实现分布文件存储与访问 推荐
- 基于.NET平台的分层架构实战(六)——依赖注入机制及IoC的设计与实现[转]
- Socket(二)基于InputStream和OutputStream实现多人聊天功能
- 基于ACE的线程池学习与实现(二)——ACE_Message_Block与ACE_Condition
- Android基于XMPP Smack Openfire下学习开发IM(一)实现用户注册、登录、修改密码和注销等
- 基于ssh2框架下多表查询的单个模块开发。其中的页面跳转是通过MVC中的ModelandView实现的。
- 基于localstorage实现购物车功能
- webservice之实现一个基于JWS的webservice项目
- 利用LinkedHashMap简单实现基于LRU策略的缓存
- 一款基于Webgl实现的3D类网页游戏
- Python基于matplotlib实现绘制三维图形功能示例
- 基于ARM的嵌入式TCP/IP协议的实现
- 基于LVS负载均衡的高性能Web站点设计与实现
- jQuery基于cookie实现的购物车实例分析
- 基于PHP生成静态页的实现方法
- EvaThumber : 基于URL的图片处理库 (可实现缩略图 | 二维码 | 水印 | 面部识别等,基于PHP)
- 基于AOP动态切换数据源实现读写分离
- 基于SNMP数据采集模块的设计和实现2