一、本文中涉及到的控件
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 {
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 }
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 }
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 }
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 }
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便是。