Animation動畫說明.pps - Hakko MONITOUCH人機介面.PPT

Chapter 16 留言板 本章提要 16 - 1 留言板的架構 16 - 2 主版頁面、管理者認證與資料庫的設計 16 - 3 建立留言板網頁 16 - 4 留言板的管理功能 16 - 1 留言板的架構 第 15 章已經為您介紹了聊天室的製作方式, 一般情況下聊天室不需保存使用者的發言, 所以第 15 章使用 Application 物件存放每筆發言, 當伺服器重新啟動時, 所有的發言便會消失。 而本章將介紹的留言板則是提供非即時溝通, 因此必須將所有留言儲存在檔案或資料庫, 才能保留資料而不至於消失。 下面是我們留言板程式的架構： 留言板的架構 留言板的架構 整個程式將由資料庫、登入網頁與留言板網頁共同組成, 並透過主版頁面 (Master Page) 統一規劃外觀。 登入網頁提供管理者登入功能, 程式並可藉此判斷是否開放留言板的管理功能；留言板網頁呈現留言的瀏覽、新增與管理畫面；資料庫除了儲存管理者登入的帳號與資料, 也同時負責儲存全部留言。 完成後留言板的功能如下： 留言板的架構 留言板的架構 留言板的架構 當管理者登入後, 留言板會顯示以下管理功能： 留言板的架構 留言板的架構 隨後第 16-2 節將說明主版頁面、管理者認證與資料庫的設計, 16-3 節製作瀏覽與新增留言的功能, 16-4 節則建立留言編輯與刪除的管理功能。 16 - 2 主版頁面、管理者認證與資料庫的設計 建置主版頁面 管理者認證機制 建立儲存留言的資料表 建置主版頁面 主版頁面的功能, 是為了統一網頁整體呈現的效果, 控制留言板的外觀。所以在設計留言板之前, 我們先配置一個主版頁面, 作為留言板網頁的設計基礎。 在主版頁面使用的控制項都將由『圖層』所包覆, 藉以控制每個控制項所在的位置與大小。 建置主版頁面 圖層就是 HTML 的 <DIV> 的區塊, 圖層所包含的控制項, 會隨著圖層位置的變動而隨之搬移, 利用此特性, 我們可任意將控制項放在指定的位置。 請執行『檔案 / 新增檔案』命令, 選取主版頁面, 將檔案名稱儲存為 “MasterPage.master”, 並在主版頁面的設計模式, 執行『配置 / 插入圖層』命令如下加入 3 個圖層： 建置主版頁面 建置主版頁面 圖層 1 將放置留言板名稱, 圖層 2 包含管理者登入的相關控制項, 圖層 3 則放置一個 ContentPlaceHolder 控制項, 完成圖如下： 建置主版頁面 隨後在 VWD 建立登入及留言板網頁時, 請勾選選擇主板頁面, 選擇 MasterPage.master, 套用本節建立的主版頁面。 管理者認證機制 我們將使用第 13 章所介紹的 ASP.NET Web 應用程式管理員建立管理者認證機制： 管理者認證機制 請建立一個名為 admin 使用者, 並設定其屬於 manager 角色： 管理者認證機制 隨後在留言板程式中, 將判斷若使用者已登入, 而且其帳號屬於 manager 角色, 便會顯示編輯、刪除留言的管理功能, 否則便只能使用新增留言功能。 您可以自行透過 ASP.NET Web 應用程式管理員, 新增使用者帳號, 然後將其加入 manager 角色, 即可使用該帳號管理留言板。 管理者認證機制 完成帳號設定後, 請建立一個 Login.aspx 的網頁檔案, 在其中放置 Login 控制項, 供管理者登入。 另外, 前面設定主版頁面時, 曾經放入 LoginView 控制項, 所以管理者可以透過該控制項顯示的連結進行登入登出。 建立儲存留言的資料表 前面使用 ASP.NET Web 應用程式管理員設定帳號之後, VWD 會自動建立名為 ASPNETDB.MDF 的資料庫, 我們要在此資料庫中, 另外建立一個 Message 資料表, 以儲存所有留言的資料。 Message 資料表的結構如下： 建立儲存留言的資料表 建立儲存留言的資料表 因為序號、日期與是否被編輯的欄位都會有預設值或自動產生值, 而編輯者與編輯日期都不是必要欄位, 所以稍後設計新增留言功能時, 只要提供標題、作者與內容欄位的值即可。 16 - 3 建立留言板網頁 留言板網頁的功能, 可分成 3 個部分, 第 1 個部分是讀取資料庫中的留言紀錄, 並顯示在留言板網頁上；第 2 部分是新增留言到資料庫；第 3 部分是留言的管理功能。 本節將會介紹前兩部分, 下節再說明管理功能。 留言板網頁的架構 留言板網頁 (GuestBook.aspx) 內有一個 MultiView 控制項, 裡面放置 2 個 View 控制項, 分別負責顯示與新增留言的功能： 留言板網頁的架構 留言板網頁的架構 View1 內使用 GridView 控制項顯示留言板內容： 留言板網頁的架構 Vi