原文位址:http://dotnetslackers.com/articles/atlas/xml_script_tutorial_part4.aspx
asp.net ajax xml-script教程(四)
原文釋出日期:2007.01.10
作者:Alessandro Gallo
翻譯:webabcd
介紹
我們已經看過了第二部分(譯者注:中文在這裡)和第三部分(譯者注:中文在這裡)的教程,如果一個用戶端類型在它的類型描述符中暴露了一個事件,我們就可以使用xml-script去聲明式的處理。在xml-script中使用action去處理事件是一種非常棒的辦法,本文我們将看到如何建立自定義action去以聲明的方式處理事件。
Actions
一個action封裝了事件被激發後所執行的一段javascript代碼塊。有一個例子就是SetProperty action,這個action允許設定用戶端元件暴露出來的屬性的值,又比如InvokeMethod action,它可以調用一個方法并傳遞參數。
Microsoft Ajax Library定義了一個被稱作PostBackAction的第三方内置action。這個action的作用是當一個事件被激發的時候後回發頁(使用asp.net的回發機制,調用__doPostBack函數)
接下來的代碼出示了PostBack action,當一個button被單擊後引起頁面的回發
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Simple Button PostBack</title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
<scripts>
<asp:ScriptReference Assembly="Microsoft.Web.Preview" Name="PreviewScript.js" />
</scripts>
</asp:ScriptManager>
<input type="button" id="btnPostBack" value="PostBack" />
<script type="text/xml-script">
<page xmlns="http://schemas.microsoft.com/xml-script/2005">
<components>
<button id="btnPostBack">
<click>
<postBackAction target="btnPostBack" eventArgument="some_argument" />
</click>
</button>
</components>
</page>
</script>
</form>
</body>
</html>
在這個例子中,單擊按鈕會引起下面這段javascript代碼被執行
__doPostBack('btnPostBack', 'some_argument');
自定義action
我們如果想建立一個自定義action,簡單的方法就是建立一個繼承自Sys.Preview.Action的類并重寫它的performAction方法。
接下來的例子出示了一個AlertAction,它可以在螢幕上顯示一個警告框。建立一個javascript檔案,命名為AlertAction.js,然後把它存在你的安裝了ajax-ctp的站點的ScriptLibrary檔案夾内并增加如下代碼
Type.registerNamespace('Samples');
Samples.AlertAction = function() {
this._message;
}
Samples.AlertAction.prototype = {
get_message : function() {
return this._message;
},
set_message : function(value) {
this._message = value;
performAction : function() {
return alert(this._message);
}
Samples.AlertAction.descriptor = {
properties: [ {name: 'message', type: String} ]
Samples.AlertAction.registerClass('Samples.AlertAction', Sys.Preview.Action);
AlertAction類暴露了一個message屬性,這個屬性的值就是彈出框的資訊。performAction被重寫了,它會調用javascript的alert方法來在螢幕上顯示資訊。注意AlertAction類繼承自Sys.Preview.Action并且暴露了一個類型描述符,允許在聲明代碼中使用這個類
最後,這裡有一段代碼說明如何使用這個AlertAction。
<%@ Page %>
<head id="Head1"
runat="server">
<title>Alert Action</title>
<asp:ScriptManager ID="TheScriptManager" runat="server">
<Scripts>
<asp:ScriptReference Path="ScriptLibrary/AlertAction.js" />
</Scripts>
<div>
<input type="button" id="myButton" value="Click Me" />
</div>
<page xmlns="http://schemas.microsoft.com/xml-script/2005" xmlns:cc="Samples">
<components>
<button id="myButton">
<click>
<cc:alertAction message="Hello Xml-script!" />
</click>
</button>
</components>
</page>
命名空間
上面那段代碼簡單易懂,因為自定義action的使用與Microsoft Ajax Library提供的内置action的使用基本相同。但是,因為AlertAction類在Samples命名空間下,是以我們必須把這個命名空間綁定到一個自定義的xml命名空間上。
做這件事的話,我們就要在page元素下增加一個屬性,說明命名空間的字首。
xmlns:cc="Samples"
然後就可以在alertAction标簽下使用我們所定義的字首了
<cc:alertAction message="Hello Xml-script!" />
我們不能使用像button,label,textBxo,postBackAction之類的字首,因為xml-script解析器會在一套預設的命名空間内根據這些字首搜尋到相應的類。
·Sys
·Sys.UI
·Sys.Net
·Sys.Preview
·Sys.Preview.UI
·Sys.Preview.Net
·Sys.Preview.Data
·Sys.Preview.UI.Data
·Sys.Preview.Services.Components
所有這些類存在于不同的命名空間裡,我們需要把它們的命名空間映射到一個xml命名空間才能正确的使用聲明代碼。
不管怎樣,在xml代碼中的根元素至少會有一個全局命名空間,像如下這樣的page元素
<page xmlns="http://schemas.microsoft.com/xml-script/2005">
總結
本文(教程的第四部分)中我們了解了如何使用PostBack action去回發一個頁,如何建立一個繼承自Sys.Action的自定義action,如何重寫performAction方法。action是通過聲明代碼執行封裝javascript代碼的非常棒的辦法。
本教程的下一部分我們将專注于學習綁定。