多數在表示層應用的服務器控件主要由兩個部分組成服務器端功能和客戶端功能服務器端功能永遠是服務器控件的核心而隨著技術的發展客戶端功能也逐漸變得越來越重要只有兩個部分互相配合才能創建出功能強大界面豐富的服務器控件本文將討論在服務器控件中實現客戶端功能的相關問題具體內容包括客戶端功能概述實現簡單客戶端功能實現復雜客戶端功能以及部署客戶端文件的實現方法等內容
客戶端功能簡介
在Web編程中客戶端功能傳統上是由Web頁開發人員負責並且不被封裝在服務器組件中脫離了這一范疇並使服務器控件能夠發出客戶端腳本從而使服務器控件能夠將客戶端處理與服務器端處理結合起來實現客戶端功能對於提高服務器控件的交互性和可擴展性的意義重大例如常見的TreeViewTabStripToolBar控件等這些優秀的服務器控件具有很強的交互性和豐富的用戶界面而這些特征的實現與客戶端功能是密不可分的
實現客戶端功能的技術主要是客戶端腳本(JavaScriptVBScript等)和DHTML因此作為一名合格的開發人員必須具有熟練應用這些技術的能力除此之外還要掌握將客戶端功能與服務器控件密切結合的方法這些內容包括實現簡單客戶端功能實現復雜客戶端功能部署客戶端腳本文件的方法
實現簡單客戶端功能
如果自定義服務器控件的客戶端功能比較簡單例如僅僅是彈出窗口或者改變背景顏色等那麼對於這種情況通過不使用單獨的客戶端腳本文件封裝而是直接在控件呈現中實現其實現的關鍵是在控件的Attributes中添加適當的客戶端處理程序以下實例說明從SystemWebUIWebControlsButton類派生的控件MyClickButton它為客戶端單擊事件提供事件處理程序請看下面的代碼
public class MyClickButton : Button{
//相關代碼
protected override void AddAttributesToRender(HtmlTextWriter writer) {
baseAddAttributesToRender(writer);
writerAddAttribute(onclick nfirm(謝謝您! ););
}
}
如果讀者已經閱讀了前面有關控件呈現的文章那麼很容易理解以上代碼以上代碼重寫了AddAttributesToRender方法它為MyClickButton控件定義了一個名為onclick的Attribute其值指示在客戶端彈出一個包含自定義信息的確認窗口如果讀者所開發的服務器控件的客戶端功能都比較簡單那麼可以嘗試利用重寫AddAttributesToRender的方法予以實現
下面是為使用MyClickControl控件而創建的ASPX頁面源代碼
<%@ Page Language = C# %>
<%@ ReGISter TagPrefix=Custom Namespace=MyControls Assembly = MyControls %>
<html>
<body>
<form runat=server>
請點擊下面的按鈕
<Custom:MyClickButton Id = demo runat=server/>
<br>
</form>
</body>
</html>
當用戶點擊MyClickControl控件時立刻彈出一個包含提示信息的確認窗口需要注意的是彈出確認窗口並不是由於頁面回傳而是用戶激發客戶端處理程序的結果當點擊確定按鈕之後才會發生頁面回傳
實現復雜客戶端功能
如果客戶端功能比較復雜這時一般將完成其功能的代碼封裝在客戶端腳本文件中為了將這些腳本文件與服務器控件緊密結合起來 框架提供了將客戶端腳本文件加入服務器控件所需的必要方法這些方法基本都包含在ClientScriptManager類中開發人員可以通過調用Page類的ClientScript屬性來獲取ClientScriptManager類實例該類用於管理腳本注冊腳本和向頁添加腳本
可能讀者對於ClientScriptManager類有些陌生它是ASPNET 的新增類該類是專門用於替代已經停止使用的用於管理腳本的Page類的部分方法而創建的例如在ASPNET x中曾經出現的ReGISterClientScriptBlockRegisterStartupScript等等這些方法都已經停止使用而改用ClientScriptManager類的相關方法來實現
下面列舉了來自ClientScriptManager類的與實現復雜客戶端功能有關的幾個常用方法
()RegisterClientScriptBlock方法
向頁的頂部添加一個腳本塊以字符串形式創建腳本然後將其傳遞給方法方法再將腳本添加到頁中可以使用此方法將任何腳本插入到頁中請注意腳本可能在所有元素完成之前呈現到頁中因此您可能無法從腳本中引用頁上的所有元素
()RegisterClientScriptInclude方法
與 RegisterClientScriptBlock 方法類似但此方法將添加引用外部 js 文件的腳本塊包含文件在任何其他動態添加的腳本之前添加因此您可能無法引用頁上的某些元素
()RegisterStartupScript方法
向頁中添加一個腳本塊該腳本塊在頁完成加載後引發頁的 onload 事件之前執行該腳本通常不創建為事件處理程序或函數它通常只包含要執行一次的語句
()RegisterOnSubmitStatement方法
添加響應頁的 onsubmit 事件而執行的腳本該腳本在提交頁之前執行允許您取消提交
()IsStartupScriptRegistered方法
確定Page對象是否注冊了啟動腳本
()IsClientScriptBlockRegistered方法
確定Page對象是否注冊了客戶端腳本
除了以上幾個方法之外ClientScriptManager類還包括其他一些相關方法有興趣的讀者可以閱讀相關資料通過在服務器控件中靈活使用以上方法我們可完成為控件加入客戶端行為同時也帶來了以下好處
()有效的減少所顯示頁面的大小因為很多有關客戶端功能的代碼都封裝到了客戶端腳本文件中在控件中只需引用腳本文件的地址即可
()由於同一控件共享腳本文件因此通過浏覽器的緩存機制可以改善應用程序的性能
()提高了控件的靈活性和可擴展性通過修改腳本文件控件開發者可以很容易的修改客戶端功能而不用編譯服務器控件
另外在對復雜客戶端功能處理的過程中有時還需要在客戶端腳本中訪問控件控件開發者可以在腳本中訪問呈現到客戶端的對象並且對其進行操作下面來簡單介紹一些有關內容
Control基類有一個ClientID的屬性它作為所呈現的元素的ID屬性呈現ASPNET動態為一個控件生成ClientID並且確保頁上每一控件的ClientID是唯一的因此可通過在文檔對象模型中使用控件的ID在客戶端上訪問該控件(即由該控件呈現的元素)控件還可以使用ClientID為它可以呈現的任何附加元素(例如隱藏域)生成唯一名稱
將ClientID的值發出到內聯腳本中(或者發出到腳本庫的代碼中)可能是較為棘手的因為該ClientID必須插在字符串變量中的正確位置以下實例使用轉義符將ClientID插入構成內聯腳本的字符串中
string element = documentgetElementById(\ + ClientID + \);
PageRegisterArrayDeclaration(Page_Validators element);
另外還可以使用String類的重載的Format方法撰寫使用ClientID的客戶端腳本
部署客戶端文件的方法
默認安裝的情況下在wwwroot文件夾下存在一個子文件夾asp_client其中保存了用於支持智能導航驗證控件等功能的客戶端腳本文件很顯然這些文件非常重要為了提高應用的規范性建議開發人員在部署客戶端文件過程中采用以下方法
· 將包含有客戶端腳本的文件夾置於asp_client文件夾中尤其是對於那些安裝在全局配件緩存(GAC)中的控件更應該這樣做
· 包含腳本的文件夾推薦使用與控件相關的名稱
· 推薦在包含腳本的文件夾下不要直接放置腳本文件而是再創建一個名稱為控件版本號的文件夾將腳本文件放置其中
例如開發人員創建了一個版本為的服務器控件MyControl其關聯一個客戶端腳本ClientScriptjs並且將該控件加入了GAC中這時推薦部署客戶端腳本文件的路徑為c:\Inetput\wwwroot\asp_client\MyControl_Client\\ClientScriptjs另外在客戶端文件庫中存儲的並不僅是腳本文件也可以加入控件所需的樣式表文件圖片等其他文件
以上為部署客戶端文件的推薦方法那麼這是不是說明所有的客戶端腳本文件都需要遵循以上規則呢?當然不是只要開發人員從實際出發從提高程序的可維護性和方便性著眼那麼無論客戶端腳本文件置於何處都是可以的
小結
本文主要介紹了與實現服務器控件客戶端功能相關的內容這些內容對於開發出交互性強的服務器控件非常重要掌握這些內容並不困難真正困難的是如何開發完成客戶端功能的CSS文件JS腳本DHTML程序等這些技術的掌握不是一朝一夕就可以完成的它需要扎實的基礎刻苦的鑽研而所有這些技術和精神品質都是一名合格的開發人員所必需掌握的精髓缺一不可
From:http://tw.wingwit.com/Article/program/net/201311/11478.html