簡介: 留言版是一種相當簡易的網路資料庫應用程式,資料庫通常必須有發言者、發言與時間等資訊功能是讓使用者可以具名發言,然後公告出去,比較麻煩的是讓每個線上使用者都能看到最新訊息,在此會用到一些AJAX定時更新的功能。附加的功能是各種搜尋的功能,譬如找出某人的發言等等,這也是本單元會示範的一個重點。 建立資料庫 首先還是建立一個空的ASP.NET網站,新增一個資料庫,在裡面新增一個資料表欄位定義如下: 我們需要的資訊是時間、暱稱與留言,且讓發言時間為主索引鍵,資料型態定義為datetime。暱稱在10個字以內,每則留言不超過50個字。資料表命名為『留言板』 40分 網頁基本設計 接下來要新增一個Web Form,留言板是給大家看的,無可避免要有自動更新的機制,也就是必須用到工具箱中AJAX擴充功能類的控制項,最先是一個ScriptManager代表AJAX相關功能的 JavaScript程式庫,接著是一個 UpdatePanel 定義網頁稍後要定時更新的區域,裡面要再放一個Timer控制項,請將他的Interval屬性改成1000,表示每秒檢查更新一次。 接著製作一個可以顯示資料表「留言板」的GridView,這個GridView就是需要持續更新的主角,所以當然要放在UpdatePanel的內部。但是輸入暱稱與發言輸入的文字方塊與按鍵則必須放在UpdatePanel的外面,如果放到裡面當你輸入資料時碰到定時更新網頁,你的輸入內容是會被清除的!你就無法完成輸入動作了。設計完成畫面大致如下圖: 發言的程式: 雙擊留言按鍵寫程式如下,目的是將資料寫入資料庫。 如果你對上面的程式覺得很抽象,可以在程式中加入一個中斷點,再執行Button1,程式中斷時將滑鼠移到S變數上面就可以看到實際產生的SQL指令了,如下圖,應該就和前面練習的SQL語句很相似了吧? 此外,要讓程式自動更新看板,也需要在Timer寫程式如下: 執行程式時應該開兩個瀏覽器視窗,產生多人上線的情況,畫面大致如下,應該某人發言時,另一個視窗也會立即看到他的發言(資料同步)。 65分 排序的設定 現在的狀況是最新發言在最下方,如果我想讓它次序顛倒(新發言在上)該怎麼做?請到設計頁面重新設定 SqlDataSource 物件即可(點它右上方的小箭頭),過程中會看到如下畫面請點:ORDER BY按鍵就是設定排序的介面。 選擇主要鍵為時間遞減即可,時間越早在此是量『小』,遞減就是從最近時間往以前排。 看到了嗎?原來排序也是用SQL語法達成的,就是在SELECT語句中加入:『ORDER BY 時間 DESC』,DESC是遞減,遞增是預設狀況就寫成:『ORDER BY 時間』,即可。 再次出現的排序變成這樣: 75分 筆數的設定 資料筆數總是越來越多,網頁應該不必(也不能)總是全部顯示,應該限制:譬如只出現最近的5筆,設定方式就沒有操作介面可以用(Visual Studio尚無支援),必須直接到原始檔,找到 SqlDataSource物件更改SelectCommand內容如下: 在原有內容中插入TOP 5,這是資料前五筆的意思,因為已經設定時間遞減,所以是最近發言的五筆。之後有心發言也會保持顯示這麼多的筆數,全部資料都還是在資料庫,但是網頁上只看得到這麼多。 不過一旦你手動進入原始碼改過SqlDataSource1的資料,當你再次想進入設定介面時會看到如下的畫面: 這個介面不再能繼續操作修改設定,原因是你手動新增的功能超過了這個介面的功能範圍,它看不懂就無法服務了!而且一旦手動修改過,即使你將內容復原了,這個介面還是不會恢復服務的,所以必須審慎使用手動修改。 因此聰明的使用方式是可以用此介面設定的,先用介面全部設好,它不會做的,譬如TOP 5,再以手動方式加入。如果你實在太厲害了,直接全部用原始碼寫 SQL也是可以的,這些介面只是幫你自動產生SQL,減少負擔而已。 85分 搜尋的程式 首先在網頁上再加如下紅色框框內的幾個物件如下: 顯示資料繫結的物件是DropDownList,應該給它設定資料連結顯示資料表的『暱稱』欄位,選擇只傳回不重複的資料,還要啟動AutoPostBack,這樣程式執行時就會顯示目前資料表中有發言者的暱稱,且即使它發言很多次也不會重複。 雙擊DropDownList物件寫程式如下: 這是使用者在DropDownList中選擇暱稱時會執行的程式,首先要暫停Timer!否則搜尋結果一秒鐘之後就被更新為全部資料了!接著是修改Select指令,重新連結資料庫之後就會看到搜尋結果,搜尋『張逸中』的畫面大致如下: 當然一旦開始搜尋,暫停Timer就等於離線了,新資料不再主動出現,因此需要一個『重新上線』的按鈕,程式只是恢復Timer的功能而已。按下之後又恢復原來隨時更新的狀態了! 在本單元中你應該知道學會使用SQL語法的重要了吧?我們必須在程式中自己建構SQL語句,否則不太可能完成任何複雜的動作。 100分 |