首先新建个项目,然后添加引用:MagicAjax.dll。然后在配置文件Web.config中放入以下配置:
接着是一个简单的应用。
首先是.aspx文件的代码:
<
httpModules
>
< add name = " MagicAjax " type = " MagicAjax.MagicAjaxModule, MagicAjax " />
</ httpModules >
这样我们就能在我们的程序中使用Ajax了。要用ajax技术的.aspx文件中还要加上这句话:
< add name = " MagicAjax " type = " MagicAjax.MagicAjaxModule, MagicAjax " />
</ httpModules >
<%
@ Register TagPrefix
=
"
ajax
"
Namespace
=
"
MagicAjax.UI.Controls
"
Assembly = " MagicAjax " %>
Assembly = " MagicAjax " %>
接着是一个简单的应用。
首先是.aspx文件的代码:
<%
@ Page language
=
"
c#
"
Codebehind
=
"
WebForm1.aspx.cs
"
AutoEventWireup
=
"
false
"
Inherits
=
"
example.WebForm1
"
%>
<% @ Register TagPrefix = " ajax " Namespace = " MagicAjax.UI.Controls "
Assembly = " MagicAjax " %>
<! DOCTYPE HTML PUBLIC " -//W3C//DTD HTML 4.0 Transitional//EN " >
< HTML >
< HEAD >
< title > WebForm1 </ title >
< meta name = " GENERATOR " Content = " Microsoft Visual Studio .NET 7.1 " >
< meta name = " CODE_LANGUAGE " Content = " C# " >
< meta name = " vs_defaultClientScript " content = " JavaScript " >
< meta name = " vs_targetSchema " content = " http://schemas.microsoft.com/intellisense/ie5 " >
</ HEAD >
< body MS_POSITIONING = " GridLayout " >
< form id = " Form1 " method = " post " runat = " server " >
< ajax:AjaxPanel id = " AjaxPanel1 " runat = " server " >
< asp:DataGrid id = " mygrid " Runat = " server " ></ asp:DataGrid >
< asp:Button id = " Button1 " style = " Z-INDEX: 101; LEFT: 48px; POSITION: absolute; TOP: 192px " runat = " server "
Text = " 确定 " Width = " 96px " BackColor = " Transparent " ></ asp:Button >
< asp:Button id = " Button2 " style = " Z-INDEX: 102; LEFT: 208px; POSITION: absolute; TOP: 192px " runat = " server "
Text = " 确定2 " Width = " 104px " BackColor = " Transparent " ></ asp:Button >
</ ajax:AjaxPanel >
< asp:DataGrid id = " DataGrid1 " style = " Z-INDEX: 103; LEFT: 368px; POSITION: absolute; TOP: 264px "
runat = " server " Width = " 240px " Height = " 248px " ></ asp:DataGrid >
< asp:Button id = " Button3 " style = " Z-INDEX: 104; LEFT: 440px; POSITION: absolute; TOP: 576px " runat = " server "
Text = " Button " Width = " 104px " Height = " 32px " ></ asp:Button >
</ form >
</ body >
</ HTML >
MagicAjax把要实现无刷的控件放在一个AjaxPanel中。在这里,我要用按钮控制DataGrid控件的显示内容,所以我把DataGrid控件和两个Button控件放在AjaxPanel中。
<% @ Register TagPrefix = " ajax " Namespace = " MagicAjax.UI.Controls "
Assembly = " MagicAjax " %>
<! DOCTYPE HTML PUBLIC " -//W3C//DTD HTML 4.0 Transitional//EN " >
< HTML >
< HEAD >
< title > WebForm1 </ title >
< meta name = " GENERATOR " Content = " Microsoft Visual Studio .NET 7.1 " >
< meta name = " CODE_LANGUAGE " Content = " C# " >
< meta name = " vs_defaultClientScript " content = " JavaScript " >
< meta name = " vs_targetSchema " content = " http://schemas.microsoft.com/intellisense/ie5 " >
</ HEAD >
< body MS_POSITIONING = " GridLayout " >
< form id = " Form1 " method = " post " runat = " server " >
< ajax:AjaxPanel id = " AjaxPanel1 " runat = " server " >
< asp:DataGrid id = " mygrid " Runat = " server " ></ asp:DataGrid >
< asp:Button id = " Button1 " style = " Z-INDEX: 101; LEFT: 48px; POSITION: absolute; TOP: 192px " runat = " server "
Text = " 确定 " Width = " 96px " BackColor = " Transparent " ></ asp:Button >
< asp:Button id = " Button2 " style = " Z-INDEX: 102; LEFT: 208px; POSITION: absolute; TOP: 192px " runat = " server "
Text = " 确定2 " Width = " 104px " BackColor = " Transparent " ></ asp:Button >
</ ajax:AjaxPanel >
< asp:DataGrid id = " DataGrid1 " style = " Z-INDEX: 103; LEFT: 368px; POSITION: absolute; TOP: 264px "
runat = " server " Width = " 240px " Height = " 248px " ></ asp:DataGrid >
< asp:Button id = " Button3 " style = " Z-INDEX: 104; LEFT: 440px; POSITION: absolute; TOP: 576px " runat = " server "
Text = " Button " Width = " 104px " Height = " 32px " ></ asp:Button >
</ form >
</ body >
</ HTML >
<
ajax:AjaxPanel id
=
"
AjaxPanel1
"
runat
=
"
server
"
>
< asp:DataGrid id = " mygrid " Runat = " server " ></ asp:DataGrid >
< asp:Button id = " Button1 " style = " Z-INDEX: 101; LEFT: 48px; POSITION: absolute; TOP: 192px " runat = " server "
Text = " 确定 " Width = " 96px " BackColor = " Transparent " ></ asp:Button >
< asp:Button id = " Button2 " style = " Z-INDEX: 102; LEFT: 208px; POSITION: absolute; TOP: 192px " runat = " server "
Text = " 确定2 " Width = " 104px " BackColor = " Transparent " ></ asp:Button >
</ ajax:AjaxPanel >
接下来是后台代码:
< asp:DataGrid id = " mygrid " Runat = " server " ></ asp:DataGrid >
< asp:Button id = " Button1 " style = " Z-INDEX: 101; LEFT: 48px; POSITION: absolute; TOP: 192px " runat = " server "
Text = " 确定 " Width = " 96px " BackColor = " Transparent " ></ asp:Button >
< asp:Button id = " Button2 " style = " Z-INDEX: 102; LEFT: 208px; POSITION: absolute; TOP: 192px " runat = " server "
Text = " 确定2 " Width = " 104px " BackColor = " Transparent " ></ asp:Button >
</ ajax:AjaxPanel >
using
System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace example
{
/**//// <summary>
/// WebForm1 的摘要说明。
/// </summary>
public class WebForm1 : System.Web.UI.Page
{
protected System.Web.UI.WebControls.DataGrid mygrid;
protected System.Web.UI.WebControls.Button Button1;
protected System.Web.UI.WebControls.Button Button2;
protected System.Web.UI.WebControls.DataGrid DataGrid1;
protected System.Web.UI.WebControls.Button Button3;
protected MagicAjax.UI.Controls.AjaxPanel AjaxPanel1;
private void Page_Load(object sender, System.EventArgs e)
{
// 在此处放置用户代码以初始化页面
ArrayList a = new ArrayList();
a.Add("a");
a.Add("b");
a.Add("c");
mygrid.DataSource = a;
mygrid.DataBind();
}
Web 窗体设计器生成的代码#region Web 窗体设计器生成的代码
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}
/**//// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void InitializeComponent()
{
this.Button1.Click += new System.EventHandler(this.Button1_Click);
this.Button2.Click += new System.EventHandler(this.Button2_Click);
this.Button3.Click += new System.EventHandler(this.Button3_Click);
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
private void Button1_Click(object sender, System.EventArgs e)
{
ArrayList a = new ArrayList();
a.Add("aa");
a.Add("bb");
a.Add("cc");
mygrid.DataSource = a;
mygrid.DataBind();
}
private void Button2_Click(object sender, System.EventArgs e)
{
ArrayList a = new ArrayList();
a.Add("aaa");
a.Add("bbb");
a.Add("ccc");
mygrid.DataSource = a;
mygrid.DataBind();
}
private void Button3_Click(object sender, System.EventArgs e)
{
ArrayList a = new ArrayList();
a.Add("e");
a.Add("f");
a.Add("g");
DataGrid1.DataSource = a;
DataGrid1.DataBind();
}
}
}
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace example
{
/**//// <summary>
/// WebForm1 的摘要说明。
/// </summary>
public class WebForm1 : System.Web.UI.Page
{
protected System.Web.UI.WebControls.DataGrid mygrid;
protected System.Web.UI.WebControls.Button Button1;
protected System.Web.UI.WebControls.Button Button2;
protected System.Web.UI.WebControls.DataGrid DataGrid1;
protected System.Web.UI.WebControls.Button Button3;
protected MagicAjax.UI.Controls.AjaxPanel AjaxPanel1;
private void Page_Load(object sender, System.EventArgs e)
{
// 在此处放置用户代码以初始化页面
ArrayList a = new ArrayList();
a.Add("a");
a.Add("b");
a.Add("c");
mygrid.DataSource = a;
mygrid.DataBind();
}
Web 窗体设计器生成的代码#region Web 窗体设计器生成的代码
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}
/**//// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void InitializeComponent()
{
this.Button1.Click += new System.EventHandler(this.Button1_Click);
this.Button2.Click += new System.EventHandler(this.Button2_Click);
this.Button3.Click += new System.EventHandler(this.Button3_Click);
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
private void Button1_Click(object sender, System.EventArgs e)
{
ArrayList a = new ArrayList();
a.Add("aa");
a.Add("bb");
a.Add("cc");
mygrid.DataSource = a;
mygrid.DataBind();
}
private void Button2_Click(object sender, System.EventArgs e)
{
ArrayList a = new ArrayList();
a.Add("aaa");
a.Add("bbb");
a.Add("ccc");
mygrid.DataSource = a;
mygrid.DataBind();
}
private void Button3_Click(object sender, System.EventArgs e)
{
ArrayList a = new ArrayList();
a.Add("e");
a.Add("f");
a.Add("g");
DataGrid1.DataSource = a;
DataGrid1.DataBind();
}
}
}