ASP.NET 2.0伺服器控制項之用戶端功能

asp.net|伺服器|用戶端|控制項

 多數在展示層應用的伺服器控制項主要由兩個部分組成：伺服器端功能和用戶端功能。伺服器端功能永遠是伺服器控制項的核心，而隨著技術的發展，用戶端功能也逐漸層得越來越重要。只有兩個部分互相配合，才能建立出功能強大、介面豐富的伺服器控制項。本文將討論在伺服器控制項中實現用戶端功能的相關問題，具體內容包括用戶端功能概述、實現簡易用戶端功能、實現複雜用戶端功能，以及部署用戶端檔案的實現方法等內容。
  
  　　1. 用戶端功能簡介
  
  　　在Web編程中，用戶端功能傳統上是由Web頁開發人員負責，並且不被封裝在伺服器組件中。ASP.net脫離了這一範疇並使伺服器控制項能夠發出用戶端指令碼，從而使伺服器控制項能夠將用戶端處理與伺服器端處理結合起來。實現用戶端功能對於提高伺服器控制項的互動性和可擴充性的意義重大。例如，常見的TreeView、TabStrip、ToolBar控制項等，這些優秀的伺服器控制項具有很強的互動性和豐富的使用者介面，而這些特徵的實現與用戶端功能是密不可分的。
  
  　　實現用戶端功能的技術主要是用戶端指令碼（JavaScript、VBScript等）和DHTML。因此，作為一名合格的開發人員必須具有熟練應用這些技術的能力。除此之外，還要掌握將用戶端功能與伺服器控制項密切結合的方法。這些內容包括：實現簡易用戶端功能、實現複雜用戶端功能、部署用戶端指令碼檔案的方法。
  
  　　2. 實現簡易用戶端功能
  
  　　如果自訂伺服器控制項的用戶端功能比較簡單，例如，僅僅是快顯視窗或者改變背景顏色等，那麼對於這種情況，通過不使用單獨的用戶端指令碼檔案封裝，而是直接在控制項呈現中實現。其實現的關鍵是在控制項的Attributes中添加適當的用戶端處理常式。以下執行個體說明從System.Web.UI.WebControls.Button類派生的控制項MyClickButton，它為用戶端單擊事件提供事件處理常式。請看下面的代碼：
  
  public class MyClickButton : Button{
  //相關代碼
  ......
  protected override void AddAttributesToRender(HtmlTextWriter writer) {
  base.AddAttributesToRender(writer);
  writer.AddAttribute("onclick", "window.confirm('謝謝您! ');");
  }
  }
  
  　　如果讀者已經閱讀了前面有關控制項呈現的文章，那麼很容易理解以上代碼。以上代碼重寫了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控制項時，立刻彈出一個包含提示資訊的確認視窗。需要注意的是彈出確認視窗並不是由於頁面回傳，而是使用者激發用戶端處理常式的結果。當點擊"確定"按鈕之後，才會發生頁面回傳。

    3. 實現複雜用戶端功能
  
  　　如果用戶端功能比較複雜，這時一般將完成其功能的代碼封裝在用戶端指令碼檔案中。為了將這些指令檔與伺服器控制項緊密結合起來，.net 2.0架構提供了將用戶端指令碼檔案加入伺服器控制項所需的必要方法。這些方法基本都包含在ClientScriptManager類中。開發人員可以通過調用Page類的ClientScript屬性來擷取ClientScriptManager類執行個體。該類用於管理指令碼、註冊指令碼和向頁添加指令碼。
  可能讀者對於ClientScriptManager類有些陌生，它是ASP.NET 2.0的新增類。該類是專門用於替代已經停止使用的用於管理指令碼的Page類的部分方法而建立的，例如，在ASP.NET 1.x中曾經出現的ReGISterClientScriptBlock、RegisterStartupScript等等，這些方法都已經停止使用，而改用ClientScriptManager類的相關方法來實現。
  
  　　下面列舉了來自ClientScriptManager類的，與實現複雜用戶端功能有關的幾個常用方法。
  　
  　　（1）RegisterClientScriptBlock方法
  　　
  　　向頁的頂部添加一個指令碼塊。以字串形式建立指令碼，然後將其傳遞給方法，方法再將指令碼添加到頁中。可以使用此方法將任何指令碼插入到頁中。請注意，指令碼可能在所有元素完成之前呈現到頁中；因此，您可能無法從指令碼中引用頁上的所有元素。
  
  　　（2）RegisterClientScriptInclude方法
  
  　　與 RegisterClientScriptBlock 方法類似，但此方法將添加引用外部 .js 檔案的指令碼塊。包含檔案在任何其他動態添加的指令碼之前添加；因此，您可能無法引用頁上的某些元素。

　（3）RegisterStartupScript方法
  
  　　向頁中添加一個指令碼塊，該指令碼塊在頁完成載入後引發頁的 onload 事件之前執行。該指令碼通常不建立為事件處理常式或函數；它通常只包含要執行一次的語句。
  
  　　（4）RegisterOnSubmitStatement方法
  
  　　添加響應頁的 onsubmit 事件而執行的指令碼。該指令碼在提交頁之前執行，允許您取消提交。
  
  　　（5）IsStartupScriptRegistered方法
  
  　　確定Page對象是否註冊了啟動指令碼。
  　
  　　（6）IsClientScriptBlockRegistered方法
  
  　　確定Page對象是否註冊了用戶端指令碼。
  
  　　除了以上幾個方法之外，ClientScriptManager類還包括其他一些相關方法，有興趣的讀者可以閱讀相關資料。通過在伺服器控制項中靈活使用以上方法，我們可完成為控制項加入用戶端行為，同時也帶來了以下好處：
  
  　　（1）有效減少所顯示頁面的大小，因為很多有關用戶端功能的代碼都封裝到了用戶端指令碼檔案中，在控制項中只需引用指令檔的地址即可。
  
  　　（2）由於同一控制項共用指令檔，因此通過瀏覽器的緩衝機制，可以改善應用程式的效能。
  
  　　（3）提高了控制項的靈活性和可擴充性。通過修改指令檔，控制項開發人員可以很容易的修改用戶端功能而不用編譯伺服器控制項。
  
  　　另外，在對複雜用戶端功能處理的過程中，有時還需要在用戶端指令碼中訪問控制項。控制項開發人員可以在指令碼中訪問呈現到用戶端的對象，並且對其進行操作。下面來簡單介紹一些有關內容。
  
  　　Control基類有一個ClientID的屬性，它作為所呈現的元素的ID屬性呈現。ASP.NET動態為一個控制項產生ClientID，並且確保頁上每一控制項的ClientID是唯一的。因此，可通過在文件物件模型中使用控制項的ID在用戶端上訪問該控制項（即，由該控制項呈現的元素）。控制項還可以使用ClientID為它可以呈現的任何附加元素（例如隱藏欄位）產生唯一名稱。
  
  　　將ClientID的值發出到內聯指令碼中（或者發出到指令碼庫的代碼中）可能是較為棘手的，因為該ClientID必須插在字串變數中的正確位置。以下執行個體使用轉義符將ClientID插入構成內聯指令碼的字串中。
  
  string element = "document.getElementById(\"" + ClientID + "\")";
  Page.RegisterArrayDeclaration("Page_Validators", element);
  
  　　另外，還可以使用String類的重載的Format方法撰寫使用ClientID的用戶端指令碼。
  
  　　4. 部署用戶端檔案的方法
  
  　　預設安裝的情況下，在wwwroot檔案夾下存在一個子檔案夾asp_client，其中儲存了用於支援智能導航、驗證控制項等功能的用戶端指令碼檔案。很顯然這些檔案非常重要。為了提高應用的規範性，建議開發人員在部署用戶端檔案過程中，採用以下方法。
  
  　　· 將包含有用戶端指令碼的檔案夾置於asp_client檔案夾中，尤其是對於那些安裝在全域配件緩衝（GAC）中的控制項更應該這樣做。
  
  　　· 包含指令碼的檔案夾推薦使用與控制項相關的名稱。
  
  　　· 推薦在包含指令碼的檔案夾下不要直接放置指令檔，而是再建立一個名稱為控制項版本號碼的檔案夾，將指令檔放置其中。
  
  　　例如，開發人員建立了一個版本為1.0的伺服器控制項MyControl，其關聯一個用戶端指令碼ClientScript.js，並且將該控制項加入了GAC中。這時推薦部署用戶端指令碼檔案的路徑為：c:\Inetput\wwwroot\asp_client\MyControl_Client\1.0\ClientScript.js。另外，在用戶端檔案庫中儲存的並不僅是指令檔，也可以加入控制項所需的樣式表檔案、圖片等其他檔案。
  
  　　以上為部署用戶端檔案的推薦方法，那麼這是不是說明所有的用戶端指令碼檔案都需要遵循以上規則呢？當然不是。只要開發人員從實際出發，從提高程式的可維護性和方便性著眼，那麼無論用戶端指令碼檔案置於何處，都是可以的。
  
  　　5. 小結
  
  　　本文主要介紹了與實現伺服器控制項用戶端功能相關的內容。這些內容對於開發出互動性強的伺服器控制項非常重要。掌握這些內容並不困難，真正困難的是如何開發完成用戶端功能的CSS檔案、JS指令碼、DHTML程式等。這些技術的掌握不是一朝一夕就可以完成的，它需要紮實的基礎，刻苦的鑽研。而所有這些技術和精神品質都是一名合格的開發人員所必需掌握的精髓，缺一不可。