个ajax.Net库的使用例子－－下拉框联动

Default.aspx.cs

using  System;
using  System.Data;
using  System.Configuration;
using  System.Collections;
using  System.Web;
using  System.Web.Security;
using  System.Web.UI;
using  System.Web.UI.WebControls;
using  System.Web.UI.WebControls.WebParts;
using  System.Web.UI.HtmlControls;

namespace  AjaxText
{
     public   partial   class  _Default : System.Web.UI.Page
    {
         public  ArrayList DataSource  =   new  ArrayList();

         protected   void  Page_Load( object  sender, EventArgs e)
        {
            Ajax.Utility.RegisterTypeForAjax( typeof (_Default));
        }
         ///   <summary>
         ///  初始化数据源
         ///   </summary>
         public   void  initDataSource()
        {
            DataSource.Add( new  address( " 湖南 " ,  " 长沙 " ));
            DataSource.Add( new  address( " 湖南 " ,  " 衡阳 " ));
            DataSource.Add( new  address( " 湖南 " ,  " 郴州 " ));
            DataSource.Add( new  address( " 湖南 " ,  " 岳阳 " ));
            DataSource.Add( new  address( " 广东 " ,  " 广州 " ));
            DataSource.Add( new  address( " 广东 " ,  " 清远 " ));
            DataSource.Add( new  address( " 广东 " ,  " 汕头 " ));
            DataSource.Add( new  address( " 湖北 " ,  " 武汉 " ));
            DataSource.Add( new  address( " 湖北 " ,  " 十堰 " ));
            DataSource.Add( new  address( " 湖北 " ,  " 仙桃 " ));
            DataSource.Add( new  address( " 湖北 " ,  " 天门 " ));
        }

         ///   <summary>
         ///  获取第一个下拉框的数据。
         ///   </summary>
         ///   <returns></returns>
        [Ajax.AjaxMethod]
         public   string  GetFirstSelectData()
        {
            initDataSource();
            ArrayList arr  =   new  ArrayList();
             foreach  (address add  in  DataSource)
            {
                 if  ( ! arr.Contains(add.strProvince))
                {
                    arr.Add(add.strProvince);
                }
            }
             string  result  =   "" ;
             foreach  ( string  str  in  arr)
                result  +=  str  +   " ; " ;
             if  (result.Length  >   0 )
                result  =  result.Substring( 0 , result.Length  -   1 );
             return  result;
        }

         ///   <summary>
         ///  根据省份获取城市。
         ///   </summary>
         ///   <param name="province"></param>
         ///   <returns></returns>
        [Ajax.AjaxMethod]
         public   string  GetCitys( string  province)
        {
            initDataSource();
             string  result  =   "" ;
             if  (province  !=   null   &&  province  !=   string .Empty)
            {
                 foreach  (address add  in  DataSource)
                {
                     if  (add.strProvince  ==  province)
                        result  +=  add.strCity  +   " ; " ;
                }
            }
             if  (result.Length  >   0 )
                result  =  result.Substring( 0 , result.Length  -   1 );
             return  result;
        }

         // 地址对象实体类
         public   class  address
        {
             public   string  strProvince;
             public   string  strCity;
             public  address( string  province, string  city)
            {
                strProvince  =  province;
                strCity  =  city;
            }
        }
    }
}

Default.aspx页面的html代码

<% @ Page Language = " C# "  AutoEventWireup = " true "  CodeBehind = " Default.aspx.cs "  Inherits = " AjaxText._Default "   %>

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

< html  xmlns ="http://www.w3.org/1999/xhtml"   >
< head  runat ="server" >
     < title > 无标题页 </ title >
     < script  language ="javascript"  type ="text/javascript" >
     // 初始化第一个下拉框，从服务端读取数据。
     // 其实这里应该直接在服务端绑定数据，此处为了演示ajax特地也使用ajax技术绑定数据。
     function  initSelect1()
    {
           var  Data = _Default.GetFirstSelectData().value
           var  strData = new  String(Data);
           var  select1 = document.getElementById( " aa " );
          select1.options.length  =   0 ; 
           var  arr = strData.split( " ; " );
           for ( var  i = 0 ;i < arr.length;i ++ )
          {
              var  varItem  =   new  Option(arr[i],arr[i]);      
             select1.options.add(varItem);
          }
    }
    
     // 第一个下拉框更改选择时，ajax调用服务端方法更新第二个下拉框数据。
     function  selectchanged()
    {
           var  select1 = document.getElementById( " aa " );
           var  Data = _Default.GetCitys(select1.value).value;
           var  strData = new  String(Data);  
           var  select2 = document.getElementById( " bb " );
          select2.options.length  =   0 ; 
           var  arr = strData.split( " ; " );
           for ( var  i = 0 ;i < arr.length;i ++ )
          {
              var  varItem  =   new  Option(arr[i],arr[i]);      
             select2.options.add(varItem);
          }
    }
     </ script >
</ head >
< body  onload ="initSelect1()" >
     < form  id ="form1"  runat ="server" >
     < div >
         < select  id ="aa"  onchange ="selectchanged()" >
             < option > unbounded </ option >
         </ select >
         < br  />< br  />
         < select  id ="bb" >
             < option > unbounded </ option >
         </ select >
    
     </ div >
     </ form >
</ body >
</ html >

使用ajax.net时应该注意的问题：

1.在pageload事件中
Ajax.Utility.RegisterTypeForAjax(typeof(_Default));
这句必须是typeof(命名空间.类名)，而不能是this.GetType()等。javascript中调用的时候直接用这里的类名。

2.调用服务端方法后加.value
如_Default.GetCitys(select1.value).value