概述ASP.NET AJAX
以組件的思想重新審視ASP.NET AJAX客戶端開(kāi)發(fā)
在進(jìn)入主題之前，我想和大家一起再來(lái)看一下本文章系列***篇中的一個(gè)Demo：ASPNETAJAXTest。我現(xiàn)在將其中的客戶端代碼重新貼在這里。
Default.aspx:
- DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"＞- ＜htmlxmlns="http://www.w3.org/1999/xhtml"＞
- ＜headrunat="server"＞
- ＜title＞UntitledPagetitle＞
- head＞
- ＜body＞
- ＜formid="form1"runat="server"＞
- ＜asp:ScriptManagerID="ScriptManager1"runat="server"＞
- ＜Scripts＞
- ＜asp:ScriptReferencePath="~/ajax.js"/＞
- Scripts＞
- ＜Services＞
- ＜asp:ServiceReferencePath="~/SayHelloService.asmx"/＞
- Services＞
- asp:ScriptManager＞
- ＜div＞
- ＜inputid="btnSayHello"type="button"value=
"SayHello"onclick="btnSayHello_onClick()"/＞- ＜divid="result"＞div＞
- ＜/div＞
- ＜/form＞
- ＜/body＞
- ＜/html＞
ajax.js:
- //單擊btnSayHello時(shí)調(diào)用的JS函數(shù)
- functionbtnSayHello_onClick(){
- SayHelloService.SayHello(OnSucceeded,OnFailded);
- }
- //成功時(shí)的回調(diào)函數(shù)
- functionOnSucceeded(reusltText){
- $get("result").innerHTML=reusltText;
- }
- //失敗時(shí)的回掉函數(shù)functionOnFailded(error){
- $get("result").innerHTML="調(diào)用失敗。錯(cuò)誤信息："+error.get_message();
- }
這是一種我們很熟悉的JavaScript編程模式：以DOM操作為基礎(chǔ)。在這種編程模式下，所有頁(yè)面元素被看成一個(gè)樹(shù)狀的DOM元素集合，不論是取得數(shù)據(jù)還是改變頁(yè)面元素的屬性，都要使用相應(yīng)的DOM操作。例如我們要取得某個(gè)文本框中的值，則首先使用 document.getElementById（在ASP.NET AJAX框架里可以縮寫為$get）方法取得這個(gè)文本框的DOM引用，然后獲取其value屬性的值。
這種編程模式，很容易給我們?cè)斐衫Щ螅缥谋究颉?fù)選框、提交按鈕、普通按鈕的DOM表示都是“input”元素，另外還要使用如innerHTML這樣不是很直觀的名字設(shè)置div或span的值。其實(shí)對(duì)于開(kāi)發(fā)人員，尤其是長(zhǎng)期從事服務(wù)器端開(kāi)發(fā)的人員來(lái)說(shuō)，我們更希望將文本框看做TextBox，將復(fù)選框看做CheckBox，將按鈕看做Button，將div或span看做Label，而且，我們更希望使用label1.text這樣的語(yǔ)句設(shè)置div中的文本，而不是使用innerHTML。
幸運(yùn)的事，ASP.NET AJAX的開(kāi)發(fā)人員顯然考慮到了這一點(diǎn)，現(xiàn)在ASP.NET AJAX框架允許我們使用類似服務(wù)器端那種組件式的編程模式來(lái)進(jìn)行客戶端編程。
【編輯推薦】
