ASP三级联动下拉菜单 80
要求数据库如下设计:
字段一 字段二 字段三
A a Aa1
A a Aa2
A a Aa3
A b Ab1
A b Ab2
B a Ba1
B a Ba2
B b Bb1
B c Bc1
B c Bc2
B c Bc3
B c Bc4
注:
最好是您的代码
或者是您的算法(请详细解释)
请不要复制粘贴一大片除select、option标签及其属性以外的html的代码,谢谢! 展开
这个也太简单了.....代码我就不贴了...我说说原理吧.
我的实现是支持无限制层次的联动.
首先就是数据库表设计.
从以上来讲应该把数据的存储方式设计为 树结构.
id 自动编号 当前结点ID
parentId 数值型 父结点ID
nodeName 文本型 结点名称
hasChild 数值型 子结点数
第一层 结点的parentId 可以使用 0
那么首先 通过AJAX加载每一层的数据.
从后台加载过来的数据格式为
{id:..
parentId:...
children:[...],
nodeName:".."
dom:document.createElement("select");
fillNode:function(){...}
...//其它
}
然后对每一层进行 渲染HTML
fillNode:function(){
for(var i=0;i<this.children.lenght;i++){
var option = document.createElement("option");
this.dom.add(op,this.dom.options.length);
option.text = this.children[i].nodeName;
option.value = this.children[i].id;
if(this.selected==this.children[i] && this.children[i].hasChild){
this.children[i].fillNode();//子层填充
}else if(this.children.length=i+1 && !this.selected){
this.selecte(this.children[i]);//把当前结点选中,初始化时用
}
}
}
以上根本为大概思路代码.
最后再实现 把一串select放到一个container元素下..
比如 writeHtml:function(container){
container = typeof container=="object"?container:document.getElementById(container);
container.appendChild(document.createTextNode(this.Label));//有时会要联动select的每个select前都有个label的就可以用..如果不要 的可以对每个结点不要增加这个属性就OK.
container.appendChild(this.dom);
if(this.selected)this.selected.writeHtml(container);//递归到子层进行渲染
}