/*******************************************************************************
/*
/* asp.net + xml + 无限级下接选择框
/*
/* Author: alan
/* Date: 2006-08-08
/* Ver: 1.0.0
/* Web: http://chengulv.cnblogs.com
/* Email:
/******************************************************************************/
/**************************** data.xml ****************************************
<?xml version='1.0'?>
<Troot>
<Item id="1" pid="0" c="1">房屋信息</Item>
<Item id="2" pid="0" c="2">日常服务</Item>
<Item id="3" pid="0" c="3">旅游指南</Item>
<Item id="4" pid="1" c="4">厂库房出租</Item>
<Item id="5" pid="1" c="1">房屋信息</Item>
<Item id="6" pid="2" c="2">日常服务</Item>
<Item id="7" pid="2" c="3">旅游指南</Item>
<Item id="8" pid="6" c="4">厂库房出租</Item>
</Troot>
******************************************************************************/
/**************************** test.htm ****************************************
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title></title>
<script language=javascript src="
http://localhost/ztl-list/js/LC_CascadeSelect.js"></script>
<SCRIPT language="javascript">
var fuc = null;
var f = null;
window.onload = function()
{
var xml = document.getElementById("xmlSource");
fuc = new LC_CascadeSelect(xml,"fuc",document.getElementById("oDIV"),"no","0");
fuc.DataBind();
f = new LC_CascadeSelect(xml,"f",document.getElementById("Div1sss"),"pp", "0,2");
f.getSelectValue(document.getElementById("xx"));
f.DataBind();
}
</SCRIPT>
</head>
<body>
<form id="Form1" method="post" runat="server" >
这是数据源:<XML id="xmlSource" src="http://localhost/ztl/data/xml/j.xml"></XML>
这是第一个<DIV id="oDIV"></DIV>
<p> </p>
这是第二个<DIV id="Div1sss"></DIV>
<input type=text id="xx">
<input type=button value="获取" onclick="document.all.xx.value = fuc.aReturn;">
</form>
</body>
</html>
******************************************************************************/
/**
* 数据绑定到控件,并显示
*
* xmlSource --- object XML数据源对像 格式"<XML id="xmlSource" src="data.xml"></XML>"
* sObj --- sting 用来存放 LC_CascadeSelect 对象的变量名称
* oDiv --- object 用来存放下接框的 div 容器对象
* prefix --- string 动态生成的<select 控件的 id 前缀;
* dValue --- string 默认选中的值, 格式:0,1,5,3
*/
function LC_CascadeSelect(xmlSource, sObj, oDiv, prefix, dValue)
{
this.xmlSource = xmlSource;
this.prefix = prefix;
this.sObj = sObj;
this.oDiv = oDiv;
this.defaultValue = dValue; // 默认选中的值, 格式:0,1,5,3
this.depth = 0;
this.objSelects = new Array(); // 多级联动的Select集合
this.sReturn = ""; // 返回用 , 分隔的选中值字串 如“1,5,3”
this.aReturn = null; // 返回 选中值的数组;
}
// 创建应有的Select对象
LC_CascadeSelect.prototype.DataBind = function ()
{
this.funCreateSelectEl(0);
};
// 创建应有的Select对象
LC_CascadeSelect.prototype.funCreateSelectEl = function(passPid)
{
// 创建DOMDocument对象
var xmlSrc = new ActiveXObject("MicroSoft.XMLDOM");
xmlSrc = this.xmlSource.XMLDocument;
// root为文档对象的根节点
var root = xmlSrc.documentElement;
// 得到所传父ID的所有节点
var currentItems = root.selectNodes("//Troot/Item[@pid = " + passPid + "]");
var iItems = currentItems.length;
if(iItems > 0)
{
// 创建Select并把OnChange事件写好
var cID = this.prefix + this.objSelects.length;
var newChild = document.createElement("<SELECT onchange=\""+ this.sObj + ".eventSltChange()\" id='" + cID+ "'>");
// 向集合中添加新建的Select对象
this.objSelects[this.objSelects.length] = newChild;
// 向Select对向添加所有的Option
var i;
for(i = 0; i < iItems; i++)
{
newChild.options.add(new Option(currentItems[i].text,currentItems[i].attributes[0].text));
}
// 将新建的Select放到目标上
this.oDiv.appendChild(newChild);
// 先置一个空白空值
newChild.options.add(new Option("请选择所属行业",null,true,true),0);
// 设置初始值
this.depth = this.depth + 1;
var svalue = this.defaultValue.split(',');
if( svalue.length > this.depth)
{
var y = document.getElementById(cID);
for(i=0; i< y.options.length; i++)
{
if (svalue[this.depth] == y.options[i].value)
{
y.selectedIndex = i;
break;
}
}
y.fireEvent("onchange");
}
}
};
// Select的OnChange事件响应函数
LC_CascadeSelect.prototype.eventSltChange = function ()
{
// 删除全部本层下的孩子
var i;
for(i = this.objSelects.length - 1; i > parseInt(event.srcElement.id.replace(this.prefix,""), 10); i--)
{
this.oDiv.removeChild(this.objSelects[i]);
this.objSelects.pop();
}
// 响应新的选择
this.funCreateSelectEl(event.srcElement.value);
// 联动的选择结果
var resultArray = new Array();
this.lastID = 0;
for(i = 0; i < this.objSelects.length; i++)
{
resultArray[i] = this.objSelects[i].value;
if(parseInt(resultArray[i])==resultArray[i] && eval("'"+parseInt(resultArray[i])+"'.length")==resultArray[i].length)
this.lastID = parseInt(resultArray[i]);
}
this.sReturn = resultArray.join(",");
if(typeof(this.oText) == "object")
{
this.oText.value = this.sReturn;
}
// 输出选定
//var s = resultArray.join("-");
};
LC_CascadeSelect.prototype.getSelectValue = function (oText)
{
this.oText = oText;
}