Microsoft Word - 序.doc

Size: px

Start display at page:

Download "Microsoft Word - 序.doc"

沁时
5 years ago
Views:

1 許多人曾問我, 如何才能學好 ASP.NET? 其實成功沒有捷徑, 若要通達 ASP.NET, 最重要的是透過扎實的學習與理解, 掌握 ASP.NET 核心精髓, 方能應付千變萬化的狀況而 ASP.NET 程式基礎, 除了學會使用 ASP.NET 各種基礎功能內建控制項外, 對於 C# 語言本身特質, 亦應有清楚理解, 同時對資料庫也要有一定熟悉度, 如此在實務開發中, 就能得心應手, 左右逢源針對以上目標, 本書以入門及實務學習為出發點, 從 VS 2012 SQL Server 資料庫到 ASP.NET 控制項皆有詳盡介紹, 並融合 C# 基礎語法教學, 讓讀者能夠有全面性的穩健學習方向同時在詳細的範例步驟引導下, 能有效增進學習效率, 減少實作練習之挫折感, 相信在用心學習後, 都能得到良好的成果且在書末附有兩章完整範例專題實作, 教您整合 ASP.NET 所有元素, 建構實務的 ASP.NET 網站, 相信能讓您領會專案開發所需注意之種種細節與考量最後, 入門技術不代表用完即丟, 反而是進階技術的根基, 因為進階技術之突破與解題, 仍須回歸到基礎概念之強弱, 基礎觀念清晰者, 對進階技術領受思維與問題解決能力就愈強 ; 所以衷心建議所有初學者, 在入門書上應多用心研讀與實作, 反覆閱讀與思考, 相信堅實的學習底子, 對日後精通 ASP.NET 定能大大的加分! 聖殿祭司奚江華

2 ASP.NET 4.5 完美入門使用 C# 網頁程式常會由 A 頁面切換導向 B 頁面, 而這中間涉及了許多技巧與議題, 例如 : 網頁導向切換的方式資料參數的傳遞網頁間的資料共用與狀態管理, 本章將逐一解說這些重要的基礎技術圖 15-1 網頁切換與狀態管理 15-1 Pages 頁面之間的切換導向技巧使用者瀏覽網頁時, 常會由 A 頁面導向 (Redirect) 到 B 頁面, 而 B 頁面又可能會切換到 C 頁面, 而網頁間的切換導向技術分為兩大類 : Client 端的頁面切換, Server 端的頁面切換 : Client 端的頁面切換類型 Client 端的網頁切換完全是在 Client 端進行, 不必提交回伺服器處理, 直接在前端就能進行網頁的切換, 常見的指令有 : Location.href Window.navigate() Window.open() 與 <a href=""></a> 四種 Server 端的頁面切換類型 Server 端的網頁切換是依賴後端伺服器來處理, 通常由 ASP.NET 控制項所引發, 進而將 Request 提交回伺服端, 再由伺服端產生網頁切換導向的指令, 常見的指令有 : Response.Redirect() Server.Transfer() 與跨網頁公佈 (Cross-Page Posting) 三種 15-2

3 Chapter 15 網頁導向及狀態管理技術 Location.href Window.navigate() Client 端 Window.open() 頁面切換技巧 <a href=""></a> Response.Redirect() Server 端 Server.Transfer() 跨網頁公佈圖 15-2 Page 頁面切換技巧頁面切換, 有時是純 Client 端技巧就可以搞定, 有的用純 Server 端技巧就可以完成, 但有時也會視情況而混用 Client 與 Server 端技巧 Client 端的頁面切換類型 Client 端常見的網頁切換導向技術有下表四種表 15-1 Client 端的網頁切換指令類型 location.href window.navigate() 使用方式 lcation.href=" window.navigate(" window.open() window.open(" <a href=""> </a> <a href=" 微軟網站 </a> 以上前三種只要在 HTML element 的 onclick 事件中, 套用指令即可, 最後一種則是屬於 HTML 的 Tag 宣告方式此外網頁在切換時, 若有資料參數需要傳遞至新的網頁, 可在網址末端以問號附加字串, 以此達到傳遞參數的目的 15-3

4 ASP.NET 4.5 完美入門使用 C# 範例 15-1 Client 端的網頁切換程式技巧在此示範表 15-1 的四種 Client 端網頁切換程式技巧, 請參考 ClientNavigate.aspx 程式 : 建立 Client 端 HTML Button 按鈕從工具箱拖曳建立三個 HTML 的 Button 按鈕圖 15-3 拖曳建立 HTML 的 Button 按鈕設定 onclick 事件執行網頁切換移轉設定 Button 的 id 與 value 屬性, 並加入 onclick 網頁導向設定 : <input id="btnlocation" onclick="location.href=' type="button" value="location.href" /> <input id="btnnavigate" onclick="window.navigate(' type="button" value="window.navigate" /> <input id="btnopen" onclick="window.open(' type="button" value="window.open" /> 一般在做 Client 端的網頁切換時, 多半由 Hyperlink 超連結或 Button 的 click 事件觸發執行, 在使用者點選後, 才執行導向的動作設定 <a href=""> <a> 的網頁導向超連結 <a></a> 是在 href 屬性指定導向的網址即可 : <a href=" 微軟網站 </a> 15-4

Chapter 15 網頁導向及狀態管理技術程式說明當點選任一 Button 時, 即會導向到另一個目標網址頁面圖 15-4 Client 端網頁的頁面切換 15-1-2 Server 端的頁面切換類型 Server 端頁面切換, 是透過伺服端的程式來進行導向當使用者點選伺服端控制項後, 然後由 Server 端產生網頁切換移轉的指令, 常見的有下表三種表 15-2 ASP.

5 Chapter 15 網頁導向及狀態管理技術程式說明當點選任一 Button 時, 即會導向到另一個目標網址頁面圖 15-4 Client 端網頁的頁面切換 Server 端的頁面切換類型 Server 端頁面切換, 是透過伺服端的程式來進行導向當使用者點選伺服端控制項後, 然後由 Server 端產生網頁切換移轉的指令, 常見的有下表三種表 15-2 ASP.NET 伺服端的網頁切換指令類型 Response.Redirect() 使用方式 Response.Redirect(" Server.Transfer() Server.Transfer("Login.aspx ") 跨網頁公佈透過 PreviousPage 物件存取來源網頁之控制項與資料以上三種方式,Redirect() 與 Transfer() 方法是在 ASP.NET 1.0 就內建的, 第三種跨網頁公佈是在 ASP.NET 2.0 才有的, 而 Redirect() 與 Transfer() 是最常被使用及拿來比較的 15-5

ASP.NET 4.5 完美入門使用 C# 表 15-3 Redirect 與 Transfer 方法之比較類型比較 Response.Redirect() Server.Transfer() 導向網站限制目標網頁類型資料參數之傳遞 Url 網址列瀏覽記錄更新可以導向任何網頁, 不限同一個網站目標網頁類型可為.

6 ASP.NET 4.5 完美入門使用 C# 表 15-3 Redirect 與 Transfer 方法之比較類型比較 Response.Redirect() Server.Transfer() 導向網站限制目標網頁類型資料參數之傳遞 Url 網址列瀏覽記錄更新可以導向任何網頁, 不限同一個網站目標網頁類型可為.htm asp jsp aspx 等任何的網頁類型透過 QueryString 傳遞資料參數在導向目標網頁後,Url 網址為目標網頁之網址會更新瀏覽器記錄 (History), 按下瀏覽器上一頁 / 下一頁或 Refresh 按鈕時, 功能正常限制來源網頁與目標網頁必須屬於同一個網站目標網頁類型必須是.aspx 類型, 不可為.asp 或.asmx 網頁除透過 QueryString 傳遞資料參數外, 還可以讀取 Form 表單集合中的值在導向目標網頁後,Url 仍維持來源網頁之網址不變不會更新瀏覽器記錄 (History), 按下瀏覽器上一頁 / 下一頁或 Refresh 按鈕時, 有可能會造成不可預期之結果範例 15-2 以 Redirect 及 Transfer 方法設計 Server 網頁導向在此示範 Redirect 及 Transfer 的網頁導向, 雖然二者在深入層面有所差異, 但是就粗淺的導向功能是差不多的, 請參考 ServerNavigate.aspx 程式 : 圖 15-5 Server 端的網頁導向技術 15-6

7 Chapter 15 網頁導向及狀態管理技術建立控制項及版面配置建立兩個 ASP.NET 的 Button 控制項, 給 Response.Redirect() 與 Server.Transfer() 使用建立伺服端網頁導向之程式雙擊兩個 Button, 建立 Response.Redirect() 及 Server.Transfer() 導向程式 : 01 // 以 Response.Redirect() 方法進行網頁切換導向 02 protected void btnredirect_click(object sender, EventArgs e) 03 { 04 Response.Redirect(" Redirect 方法 05 } // 以 Server.Transfer() 方法進行網頁切換導向 08 protected void btntransfer_click(object sender, EventArgs e) 09 { 10 Server.Transfer("TargetPage.aspx"); Transfer 方法 11 } 建立目標網頁程式加入 TargetPage.aspx 目標網頁程式 : 01 using System; public partial class TargetPage : System.Web.UI.Page 04 { 05 static string sourceurl = ""; // 來源網頁 protected void Page_Load(object sender, EventArgs e) 08 { 09 if (!IsPostBack) 10 { 11 // 讀取並保存來源網頁 Url 12 sourceurl = Request.RawUrl.ToString(); 保留來源網頁 Url 網址 13 } 14 } // 回上一頁 17 protected void btnback_click(object sender, EventArgs e) 18 { 15-7

8 ASP.NET 4.5 完美入門使用 C# 19 // 導向回到上一頁之來源網頁 20 Response.Redirect(sourceUrl); 21 } 22 } 程式說明原本 TargetPage.aspx 目標網頁不需寫任何程式就可正常執行, 但因為目標網頁常會有回到上一頁的需求, 所以順道說明如何撰寫回到上一頁的功能範例 15-3 以跨網頁公佈執行 Server 端網頁導向與資料讀取在此說明跨網頁公佈技術的運用, 以來源網頁 CrossPageSource.aspx 及目標網頁 CrossPageTarget.aspx 進行解說 : 圖 15-6 跨網頁公佈執行畫面加入來源及目標網頁加入 CrossPageSource.aspx 及 CrossPageTarget.aspx 程式, 前者為來源網頁, 後者是目標網頁在來源網頁中輸入使用者姓名, 按下 Button 按鈕後, 會導向目標網頁顯示姓名指定跨網頁公佈目標網頁來源網頁 CrossPageSource.aspx 最重要的部分, 是將 Button 按鈕的 PostBackUrl 屬性指向目標網頁 CrossPageTarget.aspx, 設定二者導向的關連性 15-8

Microsoft Word - AEL0107_CH08.doc

Microsoft Word - AEL0107_CH08.doc 8-1 Pages 頁面之間的切換移轉技巧 8-2 網頁之間的資料參數傳遞 8-3 網頁間的資料共用與 ASP.NET 狀態管理在實務的網頁設計中, 網頁常會由 A 頁面切換導向 B 頁面, 而這中間涉及了許多層面的技巧與議題, 例如 : 網頁導向切換的方式資料參數的傳遞網頁間的資料共用與狀態管理, 算是十分基礎而重要的技術, 本章將逐一解說這幾個相關的技術 A.aspx 來源網頁涉及議題