使用RedControls控件RadAjaxPanel、AjaxLoadingPanel实现GridView无刷新翻页和排序

一、本文中涉及到的控件
1、标准控件：GridView
2、RadControls控件：RadAjaxPanel和AjaxLoadingPanel

二、页面布局
     建立ASP.NET应用程序或网站，在aspx页面分别防置一个RadAjaxPanel、AjaxLoadingPanel和GridView控件（将GridView嵌套在RadAjaxPanel控件内部）。

     然后将RadAjaxPanel的LoadingPanelID属性设置为AjaxLoadingPanel控件的ID值便OK。

     下面只需要做好后台的程序工作，一个使用RadControls控件的Ajax功能就完成了。

三、编写程序构造数据及实现排序和分页功能
     1、创建数据

 1  private  ICollection CreateDataSource()
 2  {
 3      DataTable dt  =   new  DataTable();
 4      DataRow dr;
 5      Random Rand_Num  =   new  Random();
 6 
 7      dt.Columns.Add( new  DataColumn( " IntegerValue " ,  typeof (Int32)));
 8      dt.Columns.Add( new  DataColumn( " StringValue " ,  typeof ( string )));
 9      dt.Columns.Add( new  DataColumn( " CurrencyValue " ,  typeof ( double )));
10 
11       for  ( int  i  =   0 ; i  <   50 ; i ++ )
12      {
13          dr  =  dt.NewRow();
14 
15          dr[ 0 ]  =  i;
16          dr[ 1 ]  =   " Item  "   +  i.ToString();
17          dr[ 2 ]  =   1.23   *  Rand_Num.Next( 1 ,  15 );
18 
19          dt.Rows.Add(dr);
20      }
21 
22      DataView dv  =   new  DataView(dt);
23       if  (SortExpression  !=   string .Empty  &&  SortExpression  !=   null )
24      {
25          dv.Sort  =  SortExpression  +  SortDirection;
26          SwapSortDirection();
27      }
28 
29       return  dv;
30  }

     2、绑定数据

 1  string  SortExpression;
 2 
 3  protected   void  Page_Load( object  sender, EventArgs e)
 4  {
 5       if  ( ! IsPostBack)
 6      {
 7           if  (SortExpression  ==   ""   ||  SortExpression  ==   null )
 8          {
 9              SortExpression  =   " IntegerValue " ;
10          }
11          GridView1.DataSource  =  CreateDataSource();
12          GridView1.DataBind();
13      }
14  }

     3、编写排序方式属性

 1  private   string  SortDirection
 2  {
 3       get
 4      {
 5           if  (ViewState[ " SortDirection " ]  !=   null )
 6          {
 7               return  ( string )ViewState[ " SortDirection " ];
 8          }
 9           else
10          {
11               return   string .Empty;
12          }
13      }
14       set
15      {
16          ViewState[ " SortDirection " ]  =  value;
17      }
18  }
19 
20  private   void  SwapSortDirection()
21  {
22       if  (SortDirection  ==   string .Empty  ||  SortDirection  ==   "  ASC " )
23      {
24          SortDirection  =   "  DESC " ;
25      }
26       else
27      {
28          SortDirection  =   "  ASC " ;
29      }
30  }

     4、编写排序功能代码

1  protected   void  GridView1_Sorting( object  sender, GridViewSortEventArgs e)
2  {
3      Thread.Sleep( 2000 );
4      GridView gv  =  sender  as  GridView;
5      SortExpression  =  e.SortExpression;
6      gv.DataSource  =  CreateDataSource();
7      gv.DataBind();
8  }

     5、编写分页功能代码

1  protected   void  GridView1_PageIndexChanging( object  sender, GridViewPageEventArgs e)
2      {
3          Thread.Sleep( 2000 );
4           this .GridView1.PageIndex  =  e.NewPageIndex;
5          GridView1.DataSource  =  CreateDataSource();
6          GridView1.DataBind();
7      }

 

四、类似控件

     RadControls系列控件的RadAjaxPanel和AjaxLoadingPanel主要是用来实现局部刷新及Loading状态，提高用户体验的目的。除此之外我们也可以使用别的技术和控件来实现，ASP.NET AJAX所提供的UpdatePanel和UpdateProgress便是。