AjaxPro的AJAX使用示例

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

 

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

 

2、修改Web.Config

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

<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内容

    <script type="text/javascript">
        //AJAX返回数据之后的回调函数
        function callback(res)
        {
            if(!res.error)
            {
                document.all.oDataPanel.innerHTML = '<xml id="xmlData">'+ res.value +'</xml>';
            }
            else
            {
                alert(res.error.Message);
            }
        }
        
    </script>

4、添加HTML脚本

   <form id="form1" runat="server">
    <div>
    
        <%--AJAX调用--%>        
        <input onclick="MyAJAX.MyClass.GetDataSet(callback)" type="button" value="GetDataSet">
        <div id="oDataPanel">
        </div>
        <table datasrc="#xmlData" width="500" border="1" cellspacing="1" cellpadding="1">
            <thead>
                <tr>
                    <th width="70%">
                        姓名
                    </th>
                    <th width="30%">
                        年龄
                    </th>
                </tr>
            </thead>
            <tr>
                <td>
                    <span datafld="Text"></span>
                </td>
                <td>
                    <span datafld="Number"></span>
                </td>
            </tr>
        </table>
        <div id="oDataPanel1">
            是准备用来存放Xml数据源的容器
        </div>
    </div>
    </form>

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

添加内容如下

using System;
using System.Data;
using System.Configuration;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;

namespace MyAJAX
{
    public class MyClass
    {
        [AjaxPro.AjaxMethod]
        public string GetDataSet()
        {
            //假使这里要从数据库中取数据的话，也可以写了，比通过网站上的一个XML文件来返回数据直观多了，这个例子更能体现出AJAX的交互特性
            DataSet dst = new DataSet();
            DataTable dt = new DataTable();

            dt.Columns.Add("Text");
            dt.Columns.Add("Number");

            Random random = new Random(Guid.NewGuid().GetHashCode());

            for (int i = 0; i < random.Next(10, 20); i++)
            {
                DataRow row = dt.NewRow();

                row["Text"] = Guid.NewGuid().ToString("N");
                row["Number"] = random.Next(100);

                dt.Rows.Add(row);
            }

            dst.Tables.Add(dt);

            string text = "";

            using (System.IO.MemoryStream ms = new System.IO.MemoryStream())
            {
                dst.WriteXml(ms);
                ms.Position = 0;
                System.IO.StreamReader sr = new System.IO.StreamReader(ms);
                text = sr.ReadToEnd();
            }
            return text;
        }
    }
}

 

6、引用AjaxPro.2.dll

 

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

 

 

    由于各种原因,我们无法获知[ AjaxPro的AJAX使用示例]原创作者,如侵犯了您的版权,请您及时联系我们!