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>