快捷導(dǎo)航

使用AjaxPro.Net框架實(shí)現(xiàn)在客戶端調(diào)用服務(wù)端的方法

更新時(shí)間：2011年02月19日 19:20:13 作者：

AjaxPro.Net是一個(gè)優(yōu)秀的.net環(huán)境下的Ajax框架,用法很簡(jiǎn)單,可以查閱相關(guān)資料,本文檔是一個(gè)簡(jiǎn)單的實(shí)例講述使用AjaxPro的幾個(gè)關(guān)鍵點(diǎn)。

此文檔將使用AjaxPro.Net框架實(shí)現(xiàn)Ajax功能：在客戶端異步調(diào)用服務(wù)端方法。AjaxPro.Net是一個(gè)優(yōu)秀的.net環(huán)境下的Ajax框架,用法很簡(jiǎn)單,可以查閱相關(guān)資料,本文檔是一個(gè)簡(jiǎn)單的實(shí)例講述使用AjaxPro的幾個(gè)關(guān)鍵點(diǎn)。

1、下載AjaxPro 組件。并將AjaxPro.dll引用到網(wǎng)站（或項(xiàng)目）。下載：Download latest version 7.7.31.1.
2、修改Web.config。在 <system.web> 元素中添加以下代碼。
　　<configuration><system.web> <httpHandlers> 
　　　　<add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AjaxPro.2"/>
　　</httpHandlers> </system.web> </configuration>
3、對(duì)AjaxPro在頁(yè)P(yáng)age_Load事件中進(jìn)行運(yùn)行時(shí)注冊(cè)。如：
　　//AjaxPro.Utility.RegisterTypeForAjax(typeof(所在類的類名));類的類名。如是放在命名空間，則需要寫上完整的命名空間（如：namespaces._Default）
AjaxPro.Utility.RegisterTypeForAjax(typeof(testPro1));
4、創(chuàng)建服務(wù)器端方法。只要給一個(gè)方法加上[AjaxPro.AjaxMethod]標(biāo)記,該方法就變成一個(gè)AjaxPro可進(jìn)行影射調(diào)用的方法。如下：(我現(xiàn)在是新建一個(gè)testPro1.aspx頁(yè)面，在它的cs代碼中加入)

復(fù)制代碼代碼如下:

 
[AjaxPro.AjaxMethod] 
public string GetString() 
{ 
return "Hello AjaxPro"; 
} 
[AjaxPro.AjaxMethod] 
public string GetServerTime() 
{ 
return DateTime.Now.ToString(); 
} 

5、客戶端調(diào)用：

復(fù)制代碼代碼如下:

 
<script type="text/javascript"> 
function getTime() { 
alert(testPro1.GetServerTime().value); 
} 
function getServerStr() { 
//ajaxPro_guide.GetString(GetString_callback); // asynchronous call 
//var p = ClassPro.GetServerTime().toString(); 
alert(testPro1.GetString().value); 
} 
</script> 

頁(yè)面中加入以下代碼：
　　　　<input id="Button1" type="button" value="獲是服務(wù)器時(shí)間" onclick="getTime()" />
　　　　<input id="Button3" type="button" value="獲是服務(wù)器對(duì)象" onclick="getStudent()" />

二、擴(kuò)展，客戶端訪問(wèn)服務(wù)器對(duì)象
　　1、在App_code中新建類：

復(fù)制代碼代碼如下:

 
public class Student 
{ 
private string _name = "鄭伯城"; 
public int Age = 30; 
public string Name 
{ 
get { return this._name; } 
set { this._name = value; } 
} 
} 

2、在測(cè)試頁(yè)面testPro1.aspx頁(yè)面，在它的cs代碼中加入

復(fù)制代碼代碼如下:

 
[AjaxPro.AjaxMethod] 
public Student GetStudent() 
{//服務(wù)端添加GetStudent方法 
return new Student(); 
} 
private Student student = null; 
[AjaxPro.AjaxMethod] 
public void SetStudent(Student stu) 
{ 
this.student = stu; 
string name = this.student.Name; 
} 

3、aspx頁(yè)面的javascript腳本
測(cè)試aspx頁(yè)面中的腳本

復(fù)制代碼代碼如下:

 
<head id="Head1" runat="server"> 
<title>ajaxPro測(cè)試</title> 
<script type="text/javascript"> 
function getStudent() { 
var stu = testPro1.GetStudent().value; 
alert(stu.Name + " " + stu.Age); //客戶js可以訪問(wèn)服務(wù)端返回的對(duì)象 
} 
function putStudent() { 
var stu = testPro1.GetStudent().value; 
stu.Name = "劉寧"; 
testPro1.SetStudent(stu); //客戶提交對(duì)象，并且對(duì)象的Name字段已經(jīng)改變?yōu)椤皠帯绷恕?
alert(stu.Name + " " + stu.Age); //客戶js可以訪問(wèn)服務(wù)端返回的對(duì)象 
} 
</script> 
</head> 

<div><input id="Button3" type="button" value="獲是服務(wù)器對(duì)象" onclick="getStudent()" />
<input id="Button4" type="button" value="客戶端提交對(duì)象給服務(wù)器" onclick="putStudent()" />
</div>
參考：官網(wǎng)

您可能感興趣的文章: