769
2.ASP.NET AJAx架構--客戶端框架的簡單實現
完整代碼如下：02_ClientCentric.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="02_ClientCentric.aspx.cs" Inherits="ClientCentric" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Client-Centric Example</title>
</head>
<body>
<form runat="server">
<h3>客戶端為中心的解決方案【使用web服務實現】</h3>
添加一個ScriptManager控件，然後還要聲明一個服務引用指向本地web服務，從而生成服務的JavaScript代理，<br />
這樣就可以在客戶端腳本中調用這個服務了。
<!--增加一個服務引用來生成JavaScript代理-->
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Services>
<asp:ServiceReference Path="HRService.asmx" />
</Services>
</asp:ScriptManager>
<h2>Employee Lookup</h2>
<div>
<select size="5">
<option value="Engineering" >Engineering</option>
<option value="HR">Human Resources</option>
<option value="Sales">Sales</option>
<option value="Marketing">Marketing</option>
</select>
</div>
<br />
<div>
<span ></span>
<span mce_>
<img src="images/indicator.gif" mce_src="images/indicator.gif" alt="" />
Loading ...
</span>
</div>
<mce:script type="text/javascript"><!--
var departments = null;
//注冊加載（load）和卸載（unload）事件
Sys.Application.add_load(page_load);
Sys.Application.add_unload(page_unload);
function page_load(sender, e)
{
departments = $get("Departments"); //獲取到列表框
$addHandler(departments, "change", departments_onchange); //注冊改變（change）事件的注冊
//addHandler:在運行時將事件與事件處理程序相關聯，或者在添加事件處理程序時聲明要執行的代碼。
}
function page_unload(sender, e)
{
$removeHandler(departments, "change", departments_onchange); //取消改變（change）事件的注冊
}
function departments_onchange(sender, e)
{
$get("employeeResults").innerHTML = "";
$get("loading").style.display = "block";
var selectedValue = departments.value;
//調用JavaScript的代理
HRService.GetEmployeeCount(selectedValue, onSuccess);
/* 第一個參數：列表中選中的部門項。
第二個參數：是GetEmployeeCount()方法成功返回時的一個回調函數名。
*/
}
function onSuccess(result) //顯示結果
{
$get("loading").style.display = "none";
$get("employeeResults").innerHTML = "Employee count: " + result;
}
// --></mce:script>
</form>
</body>
</html>
添加的web服務類：HRService.asmx
<%@ WebService Language="C#" Class="HRService" %>
using System;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Web.Script.Services;//腳本服務的命名空間
[ScriptService] //聲明腳本支持的有關服務
[WebService(Namespace = "https://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class HRService : System.Web.Services.WebService
{
[ScriptMethod] //聲明腳本支持的有關方法
[WebMethod]
public int GetEmployeeCount(string department)
{
System.Threading.Thread.Sleep(2000);
return HumanResources.GetEmployeeCount(department);
}
}
用到的數據訪問類：HumanResources.cs
using System;
public static class HumanResources
{
public static int GetEmployeeCount(string department)
{
int count = 0;
switch (department)
{
case "Sales":
count = 10;
break;
case "Engineering":
count = 28;
break;
case "Marketing":
count = 44;
break;
case "HR":
count = 7;
break;
default:
break;
}
return count;
}
}
最後更新：2017-04-02 04:00:24