2.  Randy Pausch是美國卡內基梅隆大學的計算
機科學教授，晚年為癌症所苦，2007.9.18在
其任教大學發表演講「The Last Lecture」，
其演講內容學生深受其感動，並拜讀其書籍
與早期的演講「 Time Management」其中
有一招異於常人的時間管理方式稱為「The
four-quadrant TO DO List」
› (附圖為Randy演講時的簡報)
以ASP.NET AJAX與資料庫建置線上The four-quadrant TO DO List

3.  學生親自使用The four-quadrant TO DO
List之後發現對於學生自己的時間管理幫助相
當顯著，但是編輯to do list時採用只能夠於
單機環境下編輯，若要將其賦予「無所不在」
的性質，必要將其開發為網路應用程式，而
在本堂課程中學生恰好有能力可以實現。
以ASP.NET AJAX與資料庫建置線上The four-quadrant TO DO List

4.  普通的to do list只是將待辦事務放入並列表；而
Randy的 four-quadrant TO DO list則是將要做
的事以重要性(important)與時效性(soon)分成
四個部分，如下表格，實行時由1先做，再來是2、
3、4。
1:Important & Soon 2:Important & Not Soon
4:Not Important & Not
3:Not Important & Soon
Soon
以ASP.NET AJAX與資料庫建置線上The four-quadrant TO DO List

5.  網站全部採用ASP.NET AJAX技術，資料新增、
刪除、編輯都不會造成畫面閃爍(整頁重新讀
取)
 跨瀏覽器平台，經過測試IE、Firefox、
Ghrome、Opera皆可正常執行
 測試網址
› http://home.fhcrc.tw/98/m98_001/tdl/
以ASP.NET AJAX與資料庫建置線上The four-quadrant TO DO List

6. 以ASP.NET AJAX與資料庫建置線上The four-quadrant TO DO List

7. 資料新增區域(第一欄為必填)
 資料顯示區，分別為4個part
資料處理提示
(ASP.NET:UpdateProgress)，當使用者更動
資料時會顯示處理中圖片提示
以ASP.NET AJAX與資料庫建置線上The four-quadrant TO DO List

8.  本系統架構圖如下，以一台IIS server執行程
式，並且由另一台SQL server儲存使用者資
料(受限於主機效能不足必須分為兩台主機)
SQL
Server Data IIS server
Web browser
以ASP.NET AJAX與資料庫建置線上The four-quadrant TO DO List

9.  以ASP.NET SqlDataSource做為資料庫存取
(讀取、新增、刪除、修改)的工具
 以ASP.NET ScriptManager配置AJAX的背後
指令
 以ASP.NET UpdatePanel配置需要非同步更
新的區域(新增資料、資料庫顯示、資料處理
狀態)
以ASP.NET AJAX與資料庫建置線上The four-quadrant TO DO List

10. Id(主鍵) name deadline prior addtime owner part
唯一值 待辦內容 到期時間 排序* 新增時間* 使用者名稱 放置欄位
*
有*者尚未實現功能，資料庫目前為空值(NULL)
SQL SERVER實際操作畫面
以ASP.NET AJAX與資料庫建置線上The four-quadrant TO DO List

11.  採用ASP.NET GridView存取資料庫內容，並
且開啟其編輯(E)與刪除(D)功能，方便使用者
管理自己的to do list，如下圖
以ASP.NET AJAX與資料庫建置線上The four-quadrant TO DO List

12.  欄位驗證(以”(*)”提示)
› 因為ASP.NET的RequiredFieldValidator必須使用舊
式表單傳送資料(不支援AJAX)，所以在驗證的部分學
生自行用javascript撰寫。
 欄位清除
› 按下OK傳送資料後將text box上填的資料清除
以ASP.NET AJAX與資料庫建置線上The four-quadrant TO DO List

13.  採用外部檔案(Style.css)
管理樣式表，未來可以開
發樣式主題更換/使用者
自訂的功能
以ASP.NET AJAX與資料庫建置線上The four-quadrant TO DO List

14.  Program Tool: Visual Web Developer 2008
Express Edition(C#,.NET framework 3.5)
 Database:SQL Server 2008 Express Edition
 WEB server: IIS 7
以ASP.NET AJAX與資料庫建置線上The four-quadrant TO DO List

15.  Randy Pausch's Home Page
 Randy Pausch Lecture: Time management
 MSDN Home Page
 馬小玲傳說之我依舊閃亮
以ASP.NET AJAX與資料庫建置線上The four-quadrant TO DO List

16.  會員註冊系統，並且架站上線服務
 拖曳功能，更直覺快速的移動待辦事項位置
 系統使用條款，保障使用者權益
 根據資料庫，直接提示使用者「你現在該做什麼」
 安全性增加，如例外控制、資料溢位筆數控制
 手機面板設計，完成無所不在的to do list
 改進deadline新增方式
以ASP.NET AJAX與資料庫建置線上The four-quadrant TO DO List