利用AJax組件怎樣能讓它跟server控件交互呢，例如輸出一個列表，就只有用JS一條一條Html的輸出嗎？當然不是，現在可以與datagrid交互。
注：AJax的.net組件可以到此網下載，本文用的是for .Net 1.1版本的。http://AJax.schwarz-interactive.de/
1. 在引用中添加引用AJax.dll。（這個很廢話）
2.在web.config中建立HttpHandler（這個當然是在system.web串裡的）
＜httpHandlers＞
＜add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, AJax" /＞
＜/httpHandlers＞
3.在Global的Application_Start裡加上個設置
protected void Application_Start(Object sender, EventArgs e)
{
Ajax.Utility.HandlerPath = "AJax";
}
4.新建一個類DemoMethods，這個類裡面提供了更新數據庫和輸出列表的方法。其實主要思想就是獲得控件運行後生成的Html，然後輸出。
1 [Ajax.AJaxMethod]
2 public int AddAJaxTable(string name)
3 {
4 //輸入一個字符串，然後更新
5 SqlConnection conn = new SqlConnection(
System.Configuration.ConfigurationSettings.APPSettings["connectionString"] );
6 SqlCommand cmd = new SqlCommand("insert into AJaxTable(name) values(’"+name+"’)", conn);
7 cmd.Connection.Open();
8 int result = cmd.ExecuteNonQuery();
9 conn.Dispose();
10 cmd.Dispose();
11 return result;
12 }
13
14 [Ajax.AJaxMethod]
15 public string GetAJaxTable()
16 {
17 //這個方法就是拿到datagrid生成出來的Html
18 SqlConnection conn = new SqlConnection(System.Configuration.ConfigurationSettings.APPSettings["connectionString"]);
19 SqlCommand cmd = new SqlCommand("select * from AJaxTable order by id", conn);
20 SqlDataAdapter ap = new SqlDataAdapter( cmd );
21 DataSetds = new DataSet();
22 ap.SelectCommand.Connection.Open();
23 ap.Fill( ds, "db" );
24
25 conn.Dispose();
26 cmd.Dispose();
27
28 //實例化一個datagird類並設置好數據源
29 DataGrid dg = new DataGrid();
30 dg.DataSource = ds.Tables["db"];
31 dg.DataBind();
32
33 //實例化一個HtmlTextWriter的類
34 System.Text.StringBuilder strb = new System.Text.StringBuilder();
35 System.IO.StringWriter sw = new System.IO.StringWriter( strb );
36 System.Web.UI.HtmlTextWriter htw = new HtmlTextWriter( sw );
37
38 //執行控件的render並輸出到HtmlTextWriter裡
39 dg.RenderControl( htw );
40
41 string s = strb.ToString();
42
43 return s;//最後就是返回這個Html啦
44 }
5.然後再建一個default.js文件，用作存放 JS方法
function AddAJax(name)
{
DemoMethods.AddAJaxTable(name);
LoadGrid();
}
function LoadGrid()
{
var cc=document.getElementById("UCtd");
cc.innerHtml=DemoMethods.GetAJaxTable().value;
}
6.建一個default.ASPx，在pageload事件裡面加個注冊的東西
private void Page_Load(
object sender, System.EventArgs e)
{
Ajax.Utility.RegisterTypeForAjax(typeof(AJaxTestPrjLib.DemoMethods));
}
7.最後就是default.ASPx的Html和JS了。
＜%@ Page language="c#" Codebehind="default.ASPx.cs"
AutoEventWireup="false" Inherits="AJaxTextPrjWeb._default" %＞
＜!DOCTYPE HTML PUBLIC "-//W3C//DTD Html 4.0 Transitional//EN" ＞
＜Html＞
＜HEAD＞
＜title＞default＜/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"＞
＜script language="Javascript" src="default.JS"＞
＜/script＞
＜/HEAD＞
＜body ＞
＜form id="Form1" method="post" runat="server"＞
＜INPUT type="text" id="AddTextBox" maxlength="10"＞
＜INPUT type="button" value="添加"
＞
＜table＞
＜tr＞
＜td id="UCtd"＞＜/td＞
＜/tr＞
＜/table＞
＜/form＞
＜/body＞
＜/Html＞
這樣，就能使用datagrid來輸出表格了。總體思路其實還是比較簡單的。