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;
  12. namespace MyAJAX
  13. {
  14.     public class MyClass
  15.     {
  16.         [AjaxPro.AjaxMethod]
  17.         public string GetDataSet()
  18.         {
  19.             //假使这里要从数据库中取数据的话,也可以写了,比通过网站上的一个XML文件来返回数据直观多了,这个例子更能体现出AJAX的交互特性
  20.             DataSet dst = new DataSet();
  21.             DataTable dt = new DataTable();
  22.             dt.Columns.Add("Text");
  23.             dt.Columns.Add("Number");
  24.             Random random = new Random(Guid.NewGuid().GetHashCode());
  25.             for (int i = 0; i < random.Next(10, 20); i++)
  26.             {
  27.                 DataRow row = dt.NewRow();
  28.                 row["Text"] = Guid.NewGuid().ToString("N");
  29.                 row["Number"] = random.Next(100);
  30.                 dt.Rows.Add(row);
  31.             }
  32.             dst.Tables.Add(dt);
  33.             string text = "";
  34.             using (System.IO.MemoryStream ms = new System.IO.MemoryStream())
  35.             {
  36.                 dst.WriteXml(ms);
  37.                 ms.Position = 0;
  38.                 System.IO.StreamReader sr = new System.IO.StreamReader(ms);
  39.                 text = sr.ReadToEnd();
  40.             }
  41.             return text;
  42.         }
  43.     }
  44. }

6、引用AjaxPro.2.dll

 

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

 

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

http://download.csdn.net/source/761452

 

 

 

 

 

 

你可能感兴趣的:(JavaScript,Ajax,asp.net,callback,button,border)