DropDownList三級連動
4549 ワード
<script type="text/javascript">
window.onload = function()
{
branchOne = document.getElementById("<%=ddlBranchOne.ClientID %>");
branchTwo = document.getElementById("<%=ddlBranchTwo.ClientID %>");
branchThree = document.getElementById("<%=ddlBranchThree.ClientID %>");
//
loadBranchOne();
}
var loadBranchOne = function()
{
// URL
reqUrl = "/TheOneHRWeb/handler/GetBranchOne.aspx?ocaID=" + new Date().getTime();
//
var fnCallBack = function(oResult)
{
// Json JS
var result = eval(oResult);
//
exportDropDownList(branchOne, result);
branchOne.onchange = function()
{
if(branchOne.value != "-1")
{
//
loadBranchTwo(branchOne.value);
}
// " "
else
{
//
clearDropDownList(branchTwo);
// " "
branchTwo.options.add(new Option(" ", "-1"));
//
clearDropDownList(branchThree);
branchThree.options.add(new Option(" ", "-1"));
}
}
}
oHttp.Get(reqUrl, fnCallBack, null);
}
var loadBranchTwo = function(branchId)
{
// URL
var reqUrl = "/TheOneHRWeb/handler/GetBranchTwo.aspx?ocaID=" + new Date().getTime() +"&branchID="+branchId;
//
var fnCallBack = function(oRequest)
{
// Json JS
var result = eval(oRequest);
exportDropDownList(branchTwo, result);
branchTwo.onchange = function()
{
if(branchTwo.value != "-1")
{
loadBranchThree(branchTwo.value);
}
else
{
//
clearDropDownList(branchThree);
branchThree.options.add(new Option(" ", "-1"));
}
}
}
//alert(reqUrl);
oHttp.Get(reqUrl, fnCallBack, null);
}
var loadBranchThree = function(branchId)
{
// URL
var reqUrl = "/TheOneHRWeb/handler/GetBranchThird.aspx?ocaID=" + new Date().getTime() +"&branchID=" + branchId;
//
var fnCallBack = function(oResult)
{
var result = eval(oResult);
exportDropDownList(branchThree, result);
}
oHttp.Get(reqUrl, fnCallBack, null);
}
//
function exportDropDownList(ddl, oResult)
{
// select
clearDropDownList(ddl);
// option
var oOption = document.createElement("option");
// " "
var oSelect = document.createTextNode(" ");
// select value
oOption.setAttribute("value", "-1");
oOption.appendChild(oSelect);
ddl.appendChild(oOption);
// Json ,
for(var i = 0; i < oResult.length; i++)
{
//
var brName = oResult[i].branchName;
//
var brID = oResult[i].branchID;
var brOption = document.createElement("option");
brOption.setAttribute("value", brID);
brOption.appendChild(document.createTextNode(brName));
ddl.appendChild(brOption);
}
}
// (select)
function clearDropDownList(ddl)
{
for(var i = ddl.options.length - 1; i>=0; i--)
{
ddl.remove(i);
}
}
</script>