AjaxPanel自定义控件实现页面无刷新数据交互(做了个示例程序, 效果确实比较Cool, 用法非常简单! )(示例代码下载)

(一) . 简要

          AjaxPanel, 一个自定义控件, 只要在页面中将AjaxPanel作为父控件, 则它内部的控件在运行时无刷新. 

          做了个程序试了一下果然比较Cool !  下面介绍一下具体配置, 配置也比较简单.

(二). 运行示例图

(三). 配置

     1. 把 AjaxPanel 添加到工具箱中. 步骤如下:

  2. 在Web.Config文件的: <configuration> 节,添加如下配置:

1 
2       
3     
4     
5        
6      
7 

1 
2          
3             
4          
5

(四). 做了上面几步配置后, 下面就可以使用了, 示例代码也非常简单, 具体如下:

   1.前台页面文件 Magicajax.aspx 代码如下:

 1  < body >
 2       < form id = " form1 "  runat = " server " >
 3       < div >
 4           < ajax:AjaxPanel ID = " AjaxPanel1 "  runat = " server "  Font - Bold = " True " >
 5               < asp:Panel ID = " Panel1 "  runat = " server "  Font - Size = " XX-Large "  Height = " 45px "  Width = " 273px " >
 6                  AjaxPanel example asp:Panel>
 7             <br />
 8             <asp:Button ID="Button1" runat="server" BackColor="#FFC080" Height="26px" OnClick="Button1_Click"
 9                 Text="CreateData" Width="85px" />
10             &nbsp;
11             <asp:Button ID="Button2" runat="server" BackColor="#FFC080" Height="26px" Text="ClearData"
12                 Width="73px" /><br />
13             <br />
14             <asp:GridView ID="GridView1" runat="server" BackColor="White" BorderColor="#E7E7FF"
15                 BorderStyle="None" BorderWidth="1px" CellPadding="3" GridLines="Horizontal">
16                 <FooterStyle BackColor="#B5C7DE" ForeColor="#4A3C8C" />
17                 <RowStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" />
18                 <SelectedRowStyle BackColor="#738A9C" Font-Bold="True" ForeColor="#F7F7F7" />
19                 <PagerStyle BackColor="#E7E7FF" ForeColor="#4A3C8C" HorizontalAlign="Right" />
20                 <HeaderStyle BackColor="#4A3C8C" Font-Bold="True" ForeColor="#F7F7F7" />
21                 <AlternatingRowStyle BackColor="#F7F7F7" />
22              asp:GridView>
23          ajax:AjaxPanel>
24     
25      div>
26      form>
27  body>

  2.后台页面文件 Magicajax.aspx.cs 代码如下:

 1  public  partial  class  _Default : System.Web.UI.Page 
 2  {
 3       protected   void  Page_Load( object  sender, EventArgs e)
 4      {
 5 
 6      }
 7      private  DataTable CreateStructure()
 8     {
 9          DataTable dt  =   new  DataTable();
10          dt.Columns.Add( new  DataColumn( " CategoryID " ,  typeof ( int )));
11          dt.Columns.Add( new  DataColumn( " CategoryName " ,  typeof ( string )));
12          dt.Columns.Add( new  DataColumn( " Price " ,  typeof ( int )));      
13           return  dt;
14     }
15      public  DataSet CreateData()
16     {
17       DataSet ds  =   new  DataSet();
18       DataTable dt  =   this .CreateStructure();
19 
20       DataRow drNew  =  dt.NewRow();      
21       drNew  =  dt.NewRow();
22       drNew[ " CategoryID " ]  =   1 ;
23       drNew[ " CategoryName " ]  =   " Apple " ;
24       drNew[ " Price " ]  =   2 ;
25       dt.Rows.Add(drNew);
26 
27       drNew  =  dt.NewRow();
28       drNew[ " CategoryID " ]  =   2 ;
29       drNew[ " CategoryName " ]  =   " Banana " ;
30       drNew[ " Price " ]  =   3 ;
31       dt.Rows.Add(drNew);
32 
33       drNew  =  dt.NewRow();
34       drNew[ " CategoryID " ]  =   3 ;
35       drNew[ " CategoryName " ]  =   " Orange " ;
36       drNew[ " Price " ]  =   1 ;
37       dt.Rows.Add(drNew);
38 
39       drNew  =  dt.NewRow();
40       drNew[ " CategoryID " ]  =   4 ;
41       drNew[ " CategoryName " ]  =   " Radish " ;
42       drNew[ " Price " ]  =   2 ;
43       dt.Rows.Add(drNew);
44 
45       drNew  =  dt.NewRow();
46       drNew[ " CategoryID " ]  =   5 ;
47       drNew[ " CategoryName " ]  =   " Pen " ;
48       drNew[ " Price " ]  =   3 ;
49       dt.Rows.Add(drNew);
50 
51       drNew  =  dt.NewRow();
52       drNew[ " CategoryID " ]  =   6 ;
53       drNew[ " CategoryName " ]  =   " Pencil " ;
54       drNew[ " Price " ]  =   7 ;
55       dt.Rows.Add(drNew);
56 
57       drNew  =  dt.NewRow();
58       drNew[ " CategoryID " ]  =   7 ;
59       drNew[ " CategoryName " ]  =   " Ruler " ;
60       drNew[ " Price " ]  =   3 ;
61       dt.Rows.Add(drNew);
62 
63       drNew  =  dt.NewRow();
64       drNew[ " CategoryID " ]  =   8 ;
65       drNew[ " CategoryName " ]  =   " Eraser " ;
66       drNew[ " Price " ]  =   5 ;
67       dt.Rows.Add(drNew);
68 
69       ds.Tables.Add( dt );
70        return  ds;
71     }
72      protected   void  Button1_Click( object  sender, EventArgs e)
73     {
74         this .GridView1.DataSource  =   this .CreateData();
75         this .DataBind();
76     }
77  }

(五). 示例代码下载

      http://www.cnblogs.com/Files/ChengKing/MagicajaxExample.rar

Trackback: http://tb.blog.youkuaiyun.com/TrackBack.aspx?PostId=1145922