AjaxPro的AJAX示例

前几天突然发觉项目中的一些功能用AJAX来实现会提升运行速度和稳定性，因此了解了一下AJAX，从网络上找了一个例子，形成了我的一个Project，并且调试通过，现共享给大家，由于对AJAX不怎么了解，因此不做深入介绍。

 

1、建立ASP.Net Web应用程序，命名成MyAJAX。

 

2、修改Web.Config

找到<httpHandlers>，适当位置添加

1. <add verb="POST,GET" path="AJAXPro/*.ashx" type="AjaxPro.AjaxHandlerFactory,AjaxPro.2"/>

我这里是ASP.NET 2.0，因此下载了AjaxPro.2.dll，因此写成AjaxPro.2

 

3、打开Default.aspx，添加JavaScript内容

1.     <script type="text/javascript">
2.         //AJAX返回数据之后的回调函数
3.         function callback(res)
4.         {
5.             if(!res.error)
6.             {
7.                 document.all.oDataPanel.innerHTML = '<xml id="xmlData">'+ res.value +'</xml>';
8.             }
9.             else
10.             {
11.                 alert(res.error.Message);
12.             }
13.         }
14.         
15.     </script>

4、添加HTML脚本

1.    <form id="form1" runat="server">
2.     <div>
3.     
4.         <%--AJAX调用--%>        
5.         <input onclick="MyAJAX.MyClass.GetDataSet(callback)" type="button" value="GetDataSet">
6.         <div id="oDataPanel">
7.         </div>
8.         <table datasrc="#xmlData" width="500" border="1" cellspacing="1" cellpadding="1">
9.             <thead>
10.                 <tr>
11.                     <th width="70%">
12.                         姓名
13.                     </th>
14.                     <th width="30%">
15.                         年龄
16.                     </th>
17.                 </tr>
18.             </thead>
19.             <tr>
20.                 <td>
21.                     <span datafld="Text"></span>
22.                 </td>
23.                 <td>
24.                     <span datafld="Number"></span>
25.                 </td>
26.             </tr>
27.         </table>
28.         <div id="oDataPanel1">
29.             是准备用来存放Xml数据源的容器
30.         </div>
31.     </div>
32.     </form>

5、建立一个Class，命名为MyClass

添加内容如下

1. using System;
2. using System.Data;
3. using System.Configuration;
4. using System.Linq;
5. using System.Web;
6. using System.Web.Security;
7. using System.Web.UI;
8. using System.Web.UI.HtmlControls;
9. using System.Web.UI.WebControls;
10. using System.Web.UI.WebControls.WebParts;
11. using System.Xml.Linq;
13. namespace MyAJAX
14. {
15.     public class MyClass
16.     {
17.         [AjaxPro.AjaxMethod]
18.         public string GetDataSet()
19.         {
20.             //假使这里要从数据库中取数据的话，也可以写了，比通过网站上的一个XML文件来返回数据直观多了，这个例子更能体现出AJAX的交互特性
21.             DataSet dst = new DataSet();
22.             DataTable dt = new DataTable();
24.             dt.Columns.Add("Text");
25.             dt.Columns.Add("Number");
27.             Random random = new Random(Guid.NewGuid().GetHashCode());
29.             for (int i = 0; i < random.Next(10, 20); i++)
30.             {
31.                 DataRow row = dt.NewRow();
33.                 row["Text"] = Guid.NewGuid().ToString("N");
34.                 row["Number"] = random.Next(100);
36.                 dt.Rows.Add(row);
37.             }
39.             dst.Tables.Add(dt);
41.             string text = "";
43.             using (System.IO.MemoryStream ms = new System.IO.MemoryStream())
44.             {
45.                 dst.WriteXml(ms);
46.                 ms.Position = 0;
47.                 System.IO.StreamReader sr = new System.IO.StreamReader(ms);
48.                 text = sr.ReadToEnd();
49.             }
50.             return text;
51.         }
52.     }
53. }

6、引用AjaxPro.2.dll

 

7、可以运行了，记住要让IIS支持2.0

 

之后公布资源下载，最近资源分少了，因此想顺便赚点分，请谅解。

http://download.youkuaiyun.com/source/761452