利用ProtoType框架完成的一个下拉框(asp:DropDownList)联动的AJAX例子.

最近终于有时间研究研究AJAX了.看了一些AJAX的介绍.
用ProtoType框架完成的一个下拉框(asp:DropDownList)联动的AJAX的小例子,和初学者分享一下.

代码下载

< script language = " JavaScript "  type = " text/javascript "   >
<!--

function  goCity()
{
        var url = "AreaHandler.ashx";
        var father= $F('<%=ddlProvince.ClientID%>')
        var pars = "ddl=province&father=" +father;
        var myAjax = new Ajax.Request(
                    url,
                    {method: 'get', parameters: pars, onComplete: LoadCity}
                    );
          
                
}

function  goArea()
{

    var url = "AreaHandler.ashx";
    
    var father= $F('<%=ddlCity.ClientID%>')
            var pars = "ddl=city&father=" +father;
        var myAjax = new Ajax.Request(
                    url,
                    {method: 'get', parameters: pars, onComplete: LoadArea}
                    );

}

   function  LoadCity(originalRequest)
     {
    var result=originalRequest.responseText;
    var ddl=$('<%=ddlCity.ClientID%>')
       FillDropDown(ddl,result);
        if (ddl.length == 0){
        $('<%=ddlArea.ClientID%>').length=0;
       $('<%=ddlArea.ClientID%>').disabled = 1;
       ddl.disabled = 'true';
             }
       else{
   $('<%=ddlArea.ClientID%>').disabled = 0;
       ddl.disabled = 0;
       goArea();
    }
    }
   function  LoadArea(originalRequest)
     {
     var result=originalRequest.responseText;
     var ddl=$('<%=ddlArea.ClientID%>')
       FillDropDown(ddl,result);
       
       if (ddl.length == 0)
         ddl.disabled =1;
         esle
         ddl.disabled =0; 
  
       
    }
    
    
    function  FillDropDown(objDDL,result ) {
      var piArray = result.split(",");
           
     objDDL.length=0;
　　　 for(var i=0;i<piArray.length;i++)
　　　{
　　　var ary1 = piArray[i].toString().split("|");
　　　if (ary1.length >1 )
　　　 objDDL.options.add(new Option(ary1[1].toString(),ary1[0].toString()));
　　}
    }
  
-->
</ script >