asp.net ajax学习笔记：ASP.NET AJAX Client Library实现Ajax

1、通过单纯ASP.NET AJAX Client Library结合实现IHttpHandlerAjax异步传输

<asp:ScriptManager ID="ScriptManager1" runat="server">

</asp:ScriptManager>



<script language="javascript" type="text/javascript">

function showEmployee(firstName, lastName, title)

{

var request = new Sys.Net.WebRequest();

request.set_url('GetEmployee.ashx');

request.set_httpVerb("POST");

request.add_completed(onGetEmployeeComplete);



var requestBody = String.format(

"firstName={0}&lastName={1}&title={2}",

encodeURIComponent(firstName),

encodeURIComponent(lastName),

encodeURIComponent(title));

request.set_body(requestBody);



request.invoke();

}



function onGetEmployeeComplete(response)

{

if (response.get_responseAvailable())

{

var employee = response.get_object();

alert(String.format(

"Hello I'm {0} {1}, my title is '{2}'",

employee.FirstName,

employee.LastName,

employee.Title));

}

}

</script>

<input type="button" value="Bill Gates"

onclick="showEmployee('Bill', 'Gates', 'Chair man')" />

<input type="button" value="Steve Ballmer"

onclick="showEmployee('Steve', 'Ballmer', 'CEO')" />

GetEmployee.ashx

<%@ WebHandler Language="C#" Class="AspNetAjaxOverview.GetEmployee" %>



using System;

using System.Web;

using System.Web.Script.Serialization;



namespace AspNetAjaxOverview

{

public class GetEmployee : IHttpHandler

{

public void ProcessRequest(HttpContext context)

{

context.Response.ContentType = "text/plain";



string firstName = context.Request.Params["firstName"];

string lastName = context.Request.Params["lastName"];

string title = context.Request.Params["title"];

Employee employee = new Employee(firstName, lastName, title);



JavaScriptSerializer serializer = new JavaScriptSerializer();

string jsonEmp = serializer.Serialize(employee);



context.Response.Write(jsonEmp);

}



public bool IsReusable

{

get

{

return false;

}

}



}

}

2、通过ScriptManager中ServiceReference引用WebService来实现ajax通信

<asp:ScriptManager ID="ScriptManager1" runat="server">

<Services>

<asp:ServiceReference Path="EmployeeService.asmx" />

</Services>

</asp:ScriptManager>



<script language="javascript" type="text/javascript">

function showEmployee(firstName, lastName, title)

{

AspNetAjaxOverview.EmployeeService.GetEmployee(

firstName,

lastName,

title,

onGetEmployeeSuccess);

}



function onGetEmployeeSuccess(employee)

{

alert(String.format(

"Hello I'm {0} {1}, my title is '{2}'",

employee.FirstName,

employee.LastName,

employee.Title));

}

</script>



<input type="button" value="Bill Gates"

onclick="showEmployee('Bill', 'Gates', 'Chair man')" />

<input type="button" value="Steve Ballmer"

onclick="showEmployee('Steve', 'Ballmer', 'CEO')" />

EmployeeService.asmx

<%@ WebService Language="C#" Class="AspNetAjaxOverview.EmployeeService" %>



using System;

using System.Web;

using System.Web.Services;

using System.Web.Services.Protocols;

using System.Web.Script.Services;



namespace AspNetAjaxOverview

{

[WebService(Namespace = "http://tempuri.org/")]

[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]

[ScriptService]

public class EmployeeService : System.Web.Services.WebService

{

[WebMethod]

[ScriptMethod]

public Employee GetEmployee(string firstName, string lastName, string title)

{

return new Employee(firstName, lastName, title);

}

}

}

Employee.cs

using System;

using System.Data;

using System.Configuration;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;



namespace AspNetAjaxOverview

{

/// <summary>

/// Summary description for Employee

/// </summary>

public class Employee

{

private string _FirstName;

private string _LastName;

private string _Title;



public Employee() { }



public Employee(string firstName, string lastName, string title)

{

this._FirstName = firstName;

this._LastName = lastName;

this._Title = title;

}



public string FirstName

{

get

{

return this._FirstName;

}

}



public string LastName

{

get

{

return this._LastName;

}

}



public string Title

{

get

{

return this._Title;

}

}

}

}