DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> AJAX入門 >> AJAX詳解 >> 利用ProtoType框架完成的一個下拉框(asp:DropDownList)聯動的AJAX例子
利用ProtoType框架完成的一個下拉框(asp:DropDownList)聯動的AJAX例子
編輯: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>

http://www.cnblogs.com/rippleyong/archive/2006/12/18/596015.Html

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved