使用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)));
 
     for (int i = 0; i < 50; i++)
     {
         dr = dt.NewRow();
 
         dr[0] = i;
         dr[1] = "Item " + i.ToString();
         dr[2] = 1.23 * Rand_Num.Next(1, 15);
 
         dt.Rows.Add(dr);
     }
 
     DataView dv = new DataView(dt);
     if (SortExpression != string.Empty && SortExpression != null)
     {
         dv.Sort = SortExpression + SortDirection;
         SwapSortDirection();
     }
 
     return dv;
 }

     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";
         }
         GridView1.DataSource = CreateDataSource();
         GridView1.DataBind();
     }
 }

     3、编写排序方式属性

 1 private string SortDirection
 2 {
 3     get
 4     {
 5         if (ViewState["SortDirection"] != null)
 6         {
 7             return (string)ViewState["SortDirection"];
 8         }
 9         else
         {
             return string.Empty;
         }
     }
     set
     {
         ViewState["SortDirection"] = value;
     }
 }
 
 private void SwapSortDirection()
 {
     if (SortDirection == string.Empty || SortDirection == " ASC")
     {
         SortDirection = " DESC";
     }
     else
     {
         SortDirection = " ASC";
     }
 }

     4、编写排序功能代码

1 protected void GridView1_Sorting(object sender, GridViewSortEventArgs e)
 {
     Thread.Sleep(2000);
     GridView gv = sender as GridView;
     SortExpression = e.SortExpression;
     gv.DataSource = CreateDataSource();
     gv.DataBind();
 }

     5、编写分页功能代码

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

 

四、类似控件

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