MVC (Model-View-Control)
• What is MVC– 1979年在smalltalk語言使用
• 資料表現層、商業邏輯層
– Design Pattern(設計樣式) or framework (框架)– Separation of Concerns (關注點分離)
• Components– View (檢視)
• 負責使用者介面相關呈現,包括輸入與輸出
– Control (控制器)• 負責控制系統的流程,決定網頁操作流程,回應用戶端的要求與錯誤處理
– Model (模型)• 負責定義資料格式與資料存取介面,包括商業邏輯與資料驗證
ASP.NET MVC
• View– HTML/XML/CSS– JSON– Javascript (jQuey, JQuery UI, Ext JS,…)– AJAX
• Control– ASP.NET Controller
• Model– ADO.NET– Entity Framework– LINQ to SQL– Database operation
ASP.NET MVC & Web Form
Web Form
• 優點– 快速開發 (viewstate)
– 不用了解HTML & CSS
• 缺點– 控制元件不易微調
– 不容易測試
MVC
• 優點– 簡化複雜度
– 易於分工
– 更容易測試
– 採用同一套開發習慣
• 缺點– 缺乏元件支援
ASP.NET MVC & Web Form
Web Form
• View based
• Design Flow– 建立”Order”資料夾
– 建立”addorder.aspx”
– 從工具列拉UI元件
– 連接到datasource
• Example Code– File structure
– About
– Register/login
MVC
• Controller based
• Design Flow– URL配置
– Controller對應
– 取得對應的Model
– 將model的資料傳到view
– 實作view
• Example Code– File structure
– About
– Register/login
範例實作 –網站規劃
• 建立一個可以新增、修改、刪除SNMP設備的網頁
• 資料庫設計索引 名稱 資料型別 允許空值 範圍
Key Index int
DeviceName nvarchar(32)
DeviceIP varhar(32)
SNMPVersion int 1 ~ 2
ReadCommunity varchar(32)
WriteCommunity varchar(32)
DeviceType int ●
DeviceStatus int ●
範例實作 –建立Model
• DeviceInfo.cs
–程式碼優先開發模式 (Code First)
– using System.ComponentModel;
– using System.ComponentModel.DataAnnotations;
• [Key]:索引
• [Required]:可否為null
• [DisplayName(“設備名稱”)]:View上面所看到的名稱
• [MaxLength(32)]:最大的字串長度
• [Range(1, 2)]:數值的範圍