Giáo trình mô đun Lập trình web ASP.NET MVC (Nghề Công nghệ thông tin Trình độ cao đẳng)

BM/QT10/P.ĐTSV/04/04
Ban hành lần: 3

UBND TỈNH BÀ RỊA – VŨNG TÀU
TRƯỜNG CAO ĐẲNG KỸ THUẬT CƠNG NGHỆ

GIÁO TRÌNH
MƠ ĐUN LẬP TRÌNH WEB ASP.NET MVC
NGHỀ: CƠNG NGHỆ THƠNG TIN
TRÌNH ĐỘ: CAO ĐẲNG
(Ban hành kèm theo Quyết định số: ……/QĐ-CĐKTCN, ngày … tháng … năm
…… của Hiệu trưởng Trường Cao đẳng Kỹ thuật Công nghệ BR-VT)

BÀ RỊA – VŨNG TÀU


TUYÊN BỐ BẢN QUYỀN
Nhằm đáp ứng nhu cầu học tập và nghiên cứu cho giảng viên và sinh viên
nghề Công nghệ Thông tin trong trường Cao đẳng Kỹ thuật Công nghệ Bà Rịa –
Vũng Tàu, chúng tôi đã thực hiện biên soạn tài liệu Lập trình web ASP.NET
MVC.
Tài liệu được biên soạn thuộc loại giáo trình phục vụ giảng dạy và học tập,
lưu hành nội bộ trong Nhà trường nên các nguồn thơng tin có thể được phép
dùng ngun bản hoặc trích dùng cho các mục đích về đào tạo và tham khảo.
Mọi mục đích khác mang tính lệch lạc hoặc sử dụng với mục đích kinh
doanh thiếu lành mạnh sẽ bị nghiêm cấm.


LỜI GIỚI THIỆU
Giáo trình “Lập trình web ASP.NET MVC” được biên soạn dựa trên khung
chương trình đào tạo Cao đẳng nghề Công nghệ Thông tin đã được Trường Cao

đẳng Kỹ thuật Công nghê Bà Rịa – Vũng Tàu phê duyệt.
Tác giả đã nghiên cứu một số tài liệu, công nghệ hiện đại kết hợp với kinh
nghiệm làm việc thực tế để viết nên giáo trình này. Nội dung được tác giả trình
bày cơ động, dễ hiểu kèm theo các bước hướng dẫn thực hành chi tiết theo
nguyên tắc quan tâm đến kết quả đầu ra, khả năng tự học và kỹ năng cần thiết để
HSSV có thể hồn thành ứng dụng web quảng cáo sản phẩm, thương mại điện
tử, … bằng .NET framework theo mơ hình MVC, một trong những mơ hình ứng
dụng phổ biến hiện nay, đáp ứng nhu cầu thực tế của doanh nghiệp.
Nội dung giáo trình được chia thành 10 bài, trong đó:
Bài 1: Tổng quan về ASP.NET MVC
Bài 2: Tạo ứng dụng web ASP.NET MVC
Bài 3: Xây dựng model
Bài 4: Tạo view
Bài 5: Tạo controller
Bài 6: Truyền dữ liệu giữa controller và view
Bài 7: Thiết kế view bằng HTML Helper
Bài 8: Hiển thị dữ liệu trên Web Grid
Bài 9: Kiểm tra dữ liệu trên trang web
Bài 10: Triển khai ứng dụng
Trong quá trình biên soạn, chắc chắn giáo trình cịn nhiều thiếu sót. Tác giả
rất mong nhận được ý kiến đóng góp của q thầy/cơ và các em học sinh, sinh
viên để tiếp tục hoàn thiện hơn.
Xin chân thành cảm ơn quý đồng nghiệp, bạn bè đã có những ý kiến đóng
góp trong q trình biên soạn giáo trình này.
Bà Rịa – Vũng Tàu, ngày …… tháng …… năm ………
Tham gia biên soạn
1. Phan Hữu Phước – Chủ biên

1

MỤC LỤC
LỜI GIỚI THIỆU..................................................................................................1
MỤC LỤC.............................................................................................................2
BÀI 1: TỔNG QUAN VỀ ASP.NET MVC...........................................................9
1. Mơ hình MVC.................................................................................................9
1.1. Giới thiệu........................................................................................................9
1.2. Ưu và nhược điểm.......................................................................................10
1.3. Lý do nên làm trên mơ hình MVC...............................................................10
2. ASP.NET MVC.............................................................................................11
2.1. ASP.NET MVC là gì?..................................................................................11
2.2. Kiến trúc......................................................................................................11
2.3. Quá trình xử lý yêu cầu................................................................................12
2.4. Một số đặc điểm...........................................................................................13
2.5. So sánh MVC và Web Form.........................................................................15
CÂU HỎI, BÀI TẬP...........................................................................................16
BÀI 2: TẠO ỨNG DỤNG WEB ASP.NET MVC..............................................17
1. Thao tác tạo...................................................................................................17
2. Tổ chức lưu trữ..............................................................................................18
3. Phân biệt ASPX và Razor View Engine........................................................19
4. Cú pháp mã Razor.........................................................................................19
5. Tạo Web Page đơn giản với mã Razor..........................................................20
6. Cài đặt Entity Framework.............................................................................21
CÂU HỎI, BÀI TẬP...........................................................................................21
GỢI Ý, ĐÁP ÁN.................................................................................................22
BÀI 3: XÂY DỰNG MODEL............................................................................23
1. Khái niệm......................................................................................................23
2. Các loại Model..............................................................................................23
2.1. Data Model...................................................................................................23
2

2.2. Business Model............................................................................................24
2.3. View Model..................................................................................................24
3. Tạo Data Model.............................................................................................24
4. Model Binder.................................................................................................27
4.1. Giới thiệu DefaultModelBinder...................................................................27
4.2. Giới thiệu Model Binding (Mơ hình liên kết)..............................................27
CÂU HỎI, BÀI TẬP...........................................................................................29
BÀI 4: TẠO VIEW.............................................................................................31
1. Khái niệm View.............................................................................................31
2. Tạo View.......................................................................................................31
2.1. Các loại View...............................................................................................31
2.2. Tạo View......................................................................................................32
3. Sử dụng Layout View (Master) với Razor....................................................33
3.1. Giới thiệu _ViewStart...................................................................................33
3.2. Tạo Layout View..........................................................................................33
3.3. Tạo View Page dùng Layout View...............................................................35
3.4. Tạo Partial View...........................................................................................36
3.5. Sử dụng Partial View....................................................................................37
4. Tạo liên kết giữa các View............................................................................37
5. Chi tiết Razor................................................................................................38
5.1. Các đặc điểm về Razor.................................................................................38
5.2. Viết lệnh C# trong Razor View....................................................................39
CÂU HỎI, BÀI TẬP...........................................................................................39
BÀI 5: TẠO CONTROLLER.............................................................................41
1. ASP.NET MVC Routing...............................................................................41
1.1. Giới thiệu rout..............................................................................................41
1.2. Cấu trúc........................................................................................................42
2. Controller......................................................................................................43

3


2.1. Khái niệm.....................................................................................................43
2.2. Tạo controller...............................................................................................43
2.3. Action method..............................................................................................44
CÂU HỎI, BÀI TẬP...........................................................................................46
BÀI 6: TRUYỀN DỮ LIỆU GIỮA CONTROLLER VÀ VIEW.......................47
1. Tổng quan......................................................................................................47
2. Sử dụng ViewBag..........................................................................................47
3. Sử dụng ViewData.........................................................................................48
4. Truyền dữ liệu giữa Controller và View........................................................49
4.1. Kiểu cơ sở.....................................................................................................49
4.2. Kiểu Generic collection................................................................................49
4.3. Strongly-typed Views...................................................................................49
4.4. Dynamic.......................................................................................................50
CÂU HỎI, BÀI TẬP...........................................................................................51
BÀI 7: THIẾT KẾ VIEW BẰNG HTML HELPERS.........................................53
1. Giới thiệu.......................................................................................................53
2. Các loại HTML Helper..................................................................................53
2.1. Rendering.....................................................................................................53
2.2. HTML Form.................................................................................................55
2.3. Input..............................................................................................................56
2.4. Strongly-typed..............................................................................................56
2.5. Template.......................................................................................................57
3. Cập nhật dữ liệu trên form............................................................................57
BÀI 8: HIỂN THỊ DỮ LIỆU TRÊN WEB GRID...............................................59
1. Giới thiệu.......................................................................................................59
2. Các bước tạo..................................................................................................59
3. Định dạng dữ liệu..........................................................................................60

4. Phân trang......................................................................................................61
4


5. Sắp xếp dữ liệu..............................................................................................61
CÂU HỎI, BÀI TẬP...........................................................................................62
BÀI 9: KIỂM TRA DỮ LIỆU TRÊN TRANG WEB.........................................63
1. Data Annotations...........................................................................................63
1.1. Giới thiệu......................................................................................................63
1.2. Cú pháp chung..............................................................................................63
2. Chú thích dữ liệu...........................................................................................64
3. Kiểm tra dữ liệu với Validation Annotations.................................................64
3.1. Bắt buộc nhập...............................................................................................65
3.2. Kiểm tra độ dài chuỗi...................................................................................65
3.3. Kiểm tra miền giá trị....................................................................................66
3.4. So sánh giá trị...............................................................................................66
3.5. Kiểm tra kiểu dữ liệu....................................................................................66
3.6. Kiểm tra dữ liệu chỉ đọc...............................................................................67
3.7. Kiểm tra mẫu email......................................................................................67
3.8. Kiểm tra theo biểu thức có quy tắc...............................................................67
3.9. Hiển thị lỗi trên trang web............................................................................67
4. Giám sát lỗi trong controller.........................................................................68
4.1. Thuộc tính IsValid của ModelState..............................................................68
4.2. Giám sát lỗi phía Server...............................................................................68
CÂU HỎI, BÀI TẬP...........................................................................................69
BÀI 10: TRIỂN KHAI ỨNG DỤNG..................................................................71
1. Custom Route................................................................................................71
1.1. Đặc điểm của ASP.NET MVC Routing........................................................71
1.2. Tạo Routes tùy biến......................................................................................71
2. Xuất bản ứng dụng localhost.........................................................................72

2.1. Cài đặt IIS.....................................................................................................72
2.2. Publish ứng dụng..........................................................................................73
5


2.3. Chèn ứng dụng web trên IIS.........................................................................74
3. Xuất bản ứng dụng lên Internet.....................................................................75
3.1. Đăng ký tên miền, thuê hosting....................................................................75
3.2. Upload CSDL...............................................................................................75
3.3. Cấu hình web.config.....................................................................................75
3.4. Upload web...................................................................................................76
CÂU HỎI, BÀI TẬP...........................................................................................76
TÀI LIỆU THAM KHẢO...................................................................................77

6


GIÁO TRÌNH MƠ ĐUN
Tên mơ đun: Lập trình web ASP.NET MVC
Mã mơ đun: MĐ28
Vị trí, tính chất, ý nghĩa và vai trị của mơ đun:
 Vị trí: được giảng dạy sau khi học xong Thiết kế web, Lập trình Windows
EF và WCF, SQL Server, Cơ sở dữ liệu, Quản trị CSDL Access.
 Tính chất: là mơ đun tự chọn
 Ý nghĩa và vai trị của mơ đun: cung cấp cho người học kiến thức và kỹ
năng để xây dựng hoàn chỉnh một website thương mại điện tử, quảng bá
cho các tổ chức, cá nhân trên nền .NET Framework theo mô hình MVC.
Mục tiêu của mơ đun:
Về kiến thức:








Tìm hiểu được ngơn ngữ lập trình ASP.NET.
Tìm hiểu được mơ hình MVC (Model – View – Controller)
Biết quá trình xử lý yêu cầu của mơ hình xử lý MVC và ASP.NET MVC.
Biết được các truyền và gọi dữ liệu giữa Controller và View.
Thiết kế được phân trang cho từng trang.
Sử dụng được Bootstrap để hiệu quả và đảm bảo tính đồ họa cho từng trang

web.
 Thiết kế được những website điện tử đơn giản, các tổ chức, doanh nghiệp,
cá nhân đơn giản.
Về kỹ năng:
 Khả năng tuy duy, sáng tạo trong việc thiết kế và lập trình các ứng dụng
website điện tử cơ bản.
 Kết nối và xử lý dữ liệu bằng LINQ và Entity Framework
 Xây dựng được ứng dụng web với ASP.Net MVC
Về năng lực tự chủ và trách nhiệm:
 Rèn luyện và nâng cao kỹ năng lập trình theo công nghệ Entity Framework
(EF), Windows Communication Foundation (WCF).
 Thực hiện các bài thực hành đảm bảo đúng trình tự, an tồn.
Nội dung của mơ đun:

7

BÀI 1: TỔNG QUAN VỀ ASP.NET MVC
Mã bài: 28.1
Giới thiệu:
Model View Controller là một mơ hình kiến trúc theo hướng đối tượng, cho
phép người phát triển tách một ứng dụng thành 3 thành phần chính: Model,
View, Controller.
Mục tiêu:
 Trình bày được mơ hình, ưu và nhược điểm của MVC, lý do làm ứng dụng
trên mơ hình MVC
 Biết các thành phần và quy trình xử lý yêu cầu của ASP.NET MVC
Nội dung chính:
1. Mơ hình MVC
1.1. Giới thiệu
Model View Controller là một mơ hình kiến trúc theo hướng đối tượng, cho
phép người phát triển tách một ứng dụng thành 3 thành phần chính:
 Model: thành phần đại diện cho dữ liệu của ứng dụng, bao gồm cả chức
năng kiểm tra tính hợp lệ của dữ liệu.
 View: thành phần đảm trách việc hiển thị dữ liệu và các thành phần trong
giao diện người dùng.
 Controller: thành phần có trách nhiệm tiếp nhận và xử lý các yêu cầu gửi
đến cho ứng dụng, làm nhiệm vụ điều phối công việc giữa View và Model.
 Việc phát triển ứng dụng, nâng cấp, bảo trì và thử nghiệm trở nên đơn giản và
dễ dàng hơn.

Hình 1.1. Mơ hình 3 thành phần của MVC
1.2. Ưu và nhược điểm
Ưu điểm
9

 Phát triển phần mềm một cách chuyên nghiệp hóa, có thể chia cơng việc
cho nhiều nhóm chun mơn khác nhau
o Nhóm thiết kế
o Nhóm lập trình
o Nhóm tổ chức dữ liệu
 Giúp phát triển ứng dụng nhanh, đơn giản, dễ dàng nâng cấp
 Bảo trì: với các lớp được phân chia, các thành phần của một hệ thống dễ
dàng được thay đổi nhưng có thể được cơ lập từng lớp, hoặc chỉ ảnh hướng
đến lớp ngay gần kề nó, không làm ảnh hưởng đến cả ứng dụng.
 Mở rộng: việc thêm chức năng vào từng lớp sẽ dễ dàng hơn.
Nhược điểm
 Thích hợp với các dự án vừa và lớn
 Mất nhiều thời gian trong quá trình phát triển
 Mấ thời gian trung chuyển dữ liệu giữa các lớp
1.3. Lý do nên làm trên mơ hình MVC
 Mơ hình MVC đã chia ứng dụng thành các thành phần Model, View và
Controller nên người phát triển có thể tạo ra nhiều View và nhiều
Controller cho các Model mà không phải đối mặt với việc thay đổi trong
thiết kế Model.
 Giúp cho việc duy trì, di chuyển và tổ chức ứng dụng dễ dàng hơn.
 Đối với những người mới thì việc xây dựng ứng dụng dựa trên mơ hình
MVC phức tạp và lãng phí vì cơng việc này như là xây dựng một dự án lớn,
tuy nhiêu “bí mật” của MVC không nằm ở chỗ viết code mà ở chỗ duy trì
nó.
 Cho phép sửa code mà khơng ảnh hưởng nhiều đến các thành phần khác.
 Cho phép làm việc nhóm trở nên dễ dàng hơn vì mỗi nhóm sẽ làm việc dựa
trên thế mạnh của mình.
 Nhóm View: chịu trách nhiệm về xây dựng giao diện tương tác với người
dùng
 Nhóm Model: chịu trách nhiệm về việc xây dựng các lớp xử lý trên dữ liệu

 Nhóm Controller: có cái nhìn tổng thể về các luồng của ứng dụng, quản lý
các yêu cầu, làm việc với các Model và lựa chọn View hiển thị cho người
dùng.

10


2. ASP.NET MVC
2.1. ASP.NET MVC là gì?
 ASP.NET MVC là một Framework hỗ trợ đầy đủ cho việc xây dựng ứng
dụng web ASP.NET theo mơ hình MVC.
 Giống như ASP.NET Web Forms, ASP.NET MVC được xây dựng dựa trên
ASP.NET Framework. Điều này có nghĩa là người phát triển có thể sử dụng
các API trong ứng dụng ASP.NET Web Forms truyền thống vào trong ứng
dụng ASP.NET MVC.
 Trong ASP.NET MVC, nhiều cải tiến về ASP.NET đã được đưa vào
Framework.
 Mục đích chính của mẫu thiết kế này là cơ lập xử lý nghiệp vụ từ giao diện
người dùng để tập trung vào khả năng bảo trì, cải tiến, kiểm thử tốt hơn và
làm cho ứng dụng có cấu trúc gọn hơn.
 MVC Framework được định nghĩa trong namespace System.Web.Mvc.
2.2. Kiến trúc

Hình 1.2. Mơ hình kiến trúc 3 thành phần trong MVC
 Models là các thành phần có nhiệm vụ:
o Đọc và ghi dữ liệu
o Lưu trữ thông tin, trạng thái của các đối tượng
o Tất cả các nghiệp vụ logic đều được thực thi ở Model. Dữ liệu được
nhập từ người dùng sẽ thông qua View để kiểm tra ở Model trước khi
lưu vào CSDL. Việc truy xuất, xác nhận và lưu dữ liệu là phần việc của

Model.
 Views
11


o Là các thành phần chịu trách nhiệm hiển thị thông tin cho người dùng
thông qua giao diện
o Các thông tin cần hiển thị trên View được tạo ra từ các thành phần
Models trong mơ hình dữ liệu
 Controllers
o Là các thành phần xử lý tương tác với người dùng, làm việc với Model,
chọn một View thích hợp để hiển thị thông tin giao diện người dùng
o Trong một ứng dụng MVC, View hiển thị thơng tin, cịn điều khiển dòng
nhập xuất của người dùng vẫn do Controller đảm trách.
2.3. Quá trình xử lý yêu cầu
 Một trong những khái niệm quan trọng nhất để hiều về ứng dụng MVC là
khơng có mối quan hệ tồn tại giữa một u cầu và một tập tin vật lý bên
trong Web Server.
o Trong ứng dụng ASP.NET Web Forms truyền thống, mỗi yêu cầu được
dịch thành một lời gọi đến một tập tin trong Web Server. Ví dụ: nếu yêu
cầu là một url http://myapp/mypage.aspx thì Web Server sẽ thơng dịch
u cầu này bằng cách tìm kiếm trong thư mục của ứng dụng một tập tin
có tên là mypage.aspx. Sau đó sẽ xử lý tập tin này và trả về kết quả dạng
HTML.
o Đối với ứng dụng MVC, khi tiếp nhận một yêu cầu (ví dụ:
http://myapp/product/list) thì một thành phần được gọi là “routing
engine” sẽ so sánh yêu cầu với route cụ thể.
 Route sẽ xác định các yêu cầu bằng cách sử dụng một chuỗi nền, thiết lập
Controller và phương thức bên trong Controller cần xử lý yêu cầu.
 Khi Route được nhận diện, công cụ route tạo ra bộ giám sát yêu cầu, bộ

này lần lượt sẽ tạo ra các đối tượng Controller để xử lý u cầu (trong ví dụ
trên thì controller là product và phương thức xử lý là list).

Hình 1.3. Quá trình xử lý yêu cầu của MVC
2.4. Một số đặc điểm
 Tiếp tục hỗ trợ các tính năng trong ASP.NET
12


o Hỗ trợ sử dụng các tập tin .ASPX, ASCX, .Master như là thành phần
View
o Hỗ trợ đầy đủ các tính năng bảo mật của ASP.NET
 Form/Windows authenticate, URL authorization, Membership/Roles,
Output và data caching, secion/profile state, configuration system,
provider architecture, …
o Tách rõ ràng các mối liên quan, mở ra khả năng test TDD (Test Driven
Developer)
 Có thể test unit trong ứng dụng mà không cần phải chạy Controllers cùng
với tiến trình của ASP.NET và có thể dùng bất kỳ một unit testing
framework nào như Nunit, MBUnit, MS Test, …
 Có khả năng mở rộng ứng dụng, mọi thứ trong MVC được thiết kế để dễ
thay thế, dễ dàng tùy biến.
 Ánh xạ URL mạnh mẽ, cho phép xây dựng ứng dụng với URL gọn gàng,
thân thiện với các Search Engine
 Khơng sử dụng mơ hình PostBack từ giao diện gửi đến Server. Thay vào
đó, chủ động đưa những PostBack từ View đến thẳng Controller tùy ý.
 Khơng cịn ViewState hay Page Lifecycle tồn tại trong mơ hình MVC
 Hỗ trợ công cụ tạo View (Support for Multiple View Engine)
o Cho phép chọn công cụ tạo View
o Hộp thoại New Project cho phép xác định View Engine mặc định cho

một project
o Các lọa View Engine
 Web Forms (ASPX)
 Razor
 Hay mọt View Engine nguồn mở như Spark, Nhaml, Ndjango.
 Hỗ trợ định tuyến
o ASP.NET MVC Framework có một bộ máy ánh xạ URL thật sự mạnh
mẽ
o Bộ máy này cung cấp phương pháp rất linh hoạt trong việc ánh xạ URLs
sang các Controller.
o Có thể dễ dàng định ra các quy luật cài đặt đường đi. ASP.NET MVC
dựa vào các quy luật đó để xác định Controller và phương thức (Action)
cần phải thực thi.

13


o ASP.NET cịn có khả năng phân tích URL, chuyển các thông số trong
URL thành các tham số trong lời gọi tới phương thức trong Controller.
 Model Binding
o Model Binding là tính năng thế mạnh của ASP.NET MVC
o Hỗ trợ viết phương thức nhận một đối tượng tùy biến như là một ahm số
o Với sự hỗ trợ của Model Binding, bây giờ người phát triển chỉ cần tập
trung vào việc cài đặt các nghiệp vụ logic, không cần phải bận tâm về
việc suy nghỉ làm cách nào để ánh xạ dữ liệu từ người dùng sang các đối
tượng .NET).
 Tính năng Bunding được áp dụng mặc định. Người phát triển không cần
phải gọi các script hoặc các tập tin css riên biệt bởi vì tất cả sẽ được đóng
gói và nén lại.
 Filters: tính năng mạnh trong ASP.NET MVC, hỗ trợ cho việc kiểm tra tính

hợp lệ trước khi một phương thức hành động được gọi hoặc sau khi thi
hành.
 Razor View
o Cú pháp Razor gọn gàng và xúc tích, địi hỏi một số lượng tối thiểu các
tổ hợp phím.
o Tìm hiểu Razor tương đối dễ dàng vì nó dựa trên C# và HTML.
o Visual Studio bao gồm IntelliSense và mã cú pháp Razor được màu hóa.
o Với Razor View có thể kiểm tra từng đơn vị mà khơng đòi hỏi phải chạy
ứng dụng hoặc phải chạy Web Server.
Từ những đặc điểm đã nêu, có thể tạm tóm tắt lại các ưu và khuyết điểm của
ASP.NET MVC như sau:
 Ưu điểm
o
o
o
o

Có tính mở rộng do thay thế từng thành phần một cách dễ dàng.
Không sử dụng ViewState để điều khiển ứng dụng.
Bổ sung mới hệ thống định tuyến (Routers).
Hỗ trợ tối đa cho việc kiểm thử bằng việc tạo và cài đặt các unitests tự

động.
o Hỗ trợ kết hợp rất tốt giữa người lập trình và thiết kế giao diện.
 Khuyết điểm

14


 Thay đổi cách lập trình của Web Forms nên gây ra nhiều khó khăn cho

những người chuyên sử dụng Web Forms chuyển sang mơ hình này
(khơng cịn hướng đến các sự kiển của các control).
 Người lập trình phải biết nhiều về HTTP, HTML, CSS và Javascript.
 Áp dụng cho dự án nhỏ thì quá cồng kềnh và phức tạp
2.5. So sánh MVC và Web Form
 ASP.NET Web Forms sử dụng ViewState để quản lý  khi có sự tương tác
với người dùng thì xử lý chậm.
 ASP.NET MVC chia làm 3 thành phần: Model, View, Controller.
 Mọi tương tác của người dùng với Views sẽ được xử lý thông qua việc thực
hiện các phương thức hành động trong Controllers, khơng cịn PostBack,
Lifecycle và events.
 Việc kiểm tra (test) và gỡ lỗi (debug)
o ASP.NET Web Forms chạy tất cả các tiến trình, sự thay đổi ID của bất kỳ
control nào cũng ảnh hưởng đến ứng dụng.
o Với MVC, việc đó có thể sử dụng các unit test để thẩm định rất dễ dàng
các Controller thực hiện thế nào.
Bảng so sánh các tính năng giữa ASP.NET Web Forms và ASP.NET MVC
Tính năng
ASP.NET Web Forms
ASP.NET MVC
Kiến trúc
Mơ hình Web form  Sử dụng việc phân chia ứng
dụng thành Models, Views,
Bussiness  Database
Controllers
Cú pháp
Sử dụng cú pháp của Web Các sự kiện được điều khiển
Form, tất cả các sự kiện và bởi các controller, các
controls do Server quản lý
controller không do Server

quản lý
Truy cập dữ Sử dụng hầu hết các công Phần lớn dùng LINQ to SQL
liệu
nghệ truy cập dữ liệu trong và Entity Framework để tạo
ứng dụng
mơ hình truy cập đối tượng
Debug
Phải thực hiện tất cả bao gồm Có thể sử dụng các unit test để
các lớp truy cập dữ liệu, hiển kiểm tra các phương thức
thị, điều khiển các control
trong các controller
Tốc độ phân Chậm khi trong trang có quá Nhanh hơn do khơng quản lý
tải
nhiều control vì ViewState ViewState
q lớn
Tương tác với Khó khăn vì các control Dễ dàng vì các đối tượng
Javascript
được điều khiển bởi Server
khơng do Server quản lý
URL
Không thân thiện
Thân thiện
15


CÂU HỎI, BÀI TẬP
1.1. Cho biết tên và chức năng của từng thành phần chính trong ứng dụng web
ASP.NET MVC

16

BÀI 2: TẠO ỨNG DỤNG WEB ASP.NET MVC
Mã bài: 28.2
Giới thiệu:
Bài này cung cấp cho người học những kiến thức và kỹ năng để tạo mới
một ứng dụng ASP.NET MVC sử dụng mã Razor và cài đặt Entity Framework.
Mục tiêu:





Trình bày cú pháp mã Razor
Tạo được ứng dụng web ASP.NET MVC
Cài đặt Entity Framework cho ứng dụng
Cẩn thận thực hiện đúng các bước, chọn đúng ngôn ngữ, đường dẫn khi tạo
ứng dụng

Nội dung chính:
1. Thao tác tạo
 Khởi động Visual Studio 2015/2017/2019
 Tạo mới project, chọn .NET Framework, thư mục và tên project theo hộp
thoại dưới rồi chọn OK

Hình 2.1. Tạo ứng dụng ASP.NET
 Chọn MVC trong hộp thoại Select a template, chọn Change Authentication

17

Hình 2.2. Chọn mơ hình MVC cho ứng dụng web
 Chọn No Authentication

Hình 2.3. Chọn loại chứng thực quản lý người dùng
3. Tổ chức lưu trữ
Cấu trúc thư mục của ứng dụng ASP.NET MVC gồm 3 thực mục chính:
 Controllers: lưu trữ các class đóng vai trị Controller
 Models: lưu trữ các class Model
 Views: lưu trữ các View
18


Các thư mục khác
 Content: chứa các tập tin CSS, hình ảnh liên quan đến giao diện
 Scripts: chứa các thư viện Javascript, jquery
 App_Start: chứa các tập tin liên quan đến việc cấu hình cho các tính năng
như: routes, filters, bundles
 App_Data: lưu trữ tập tin dữ liệu XML hoặc local database, SQLite
 Bin: lưu trữ các compiled của ứng dụng
4. Phân biệt ASPX và Razor View Engine
Giống nhau
 Đều dùng để hiện thị giao diện trên Web Browser, có khái niệm về Master
Page và User Control được định nghĩa với Layout (View để kế thừa
Layout) và PartialView (subView)
Khác nhau
 ASPX: vẫn có thể sử dụng được các Master Page và User Control (kể cả
đóng vai trị chỉ hiện thị dữ liệu và không xử lý được dữ liệu)  dễ dàng
cho người lập trình chưa kịp thích nghi với phong cách của MVC, ngồi ra
vẫn có thể sử dụng được subView để thay đổi cho User Control để xử lý dữ

liệu từ action
 Razor: được hỗ trợ mạnh hơn về Javascript, tùy chỉnh linh hoạt giữa code
C# với HTML, linh hoạt trong Layout và subView (PartialView)
 Cú pháp HTML Helpers trong ASPX
<% các_lệnh_được_viết_ở_đây %>

 Cú pháp HTML Helper trong Razor
@các_lệnh_được_viết_ở_đây

Ví dụ: tạo một TextBox có Id là txtFirstName
@Html.TextBox(“txtFirstName”)
5. Cú pháp mã Razor
 Khối lệnh
@{
//Các lệnh C# được viết tại đây
}

 Biểu thức Inline: bắt đầu bằng @

@DateTime.Now.ToString(“dd/MM/yyyy”)

 Khai báo biến bằng từ khóa var
 Vịng lặp
o for
@for(var i = 10; i < 21; i++)

19


{

Line @i

}

o foreach

@foreach (var x in Request.ServerVariables)
{<li>@x</li>}

o while

@{

var i = 0;
while (i < 5)
{
i += 1;

Line @i

}
}

 Tập tin có phần mở rộng là .cshtml
6. Tạo Web Page đơn giản với mã Razor
Click chuột phải lên project  Add  New Item…

Hình 2.4. Tạo web page Razor
Biên tập nội dung

20


7. Cài đặt Entity Framework
Click chuột phải lên project  Manage NuGet Packages
Chọn Online  nuget.org trong cây bên trái

Nhập entity framework vào hộp tìm kiếm
Chờ Magage NuGet Packages hiển thị kết quả rồi click chuột lên nút Install tại
dùng EntityFramework trong danh sách để cài đặt.

Hình 2.5. Tìm kiếm và cài đặt Entity Framework cho ứng dụng
CÂU HỎI, BÀI TẬP
Bài 2.1: Tạo ứng dụng ASP.NET MVC có tên Bookstore.
Bài 2.2. Sử dụng vòng lặp tạo nội dung cho trang chủ.
Sản phẩm 1
21


Sản phẩm 2
Sản phẩm 3
…
Sản phẩm 9
Bài 2.3. Sử dụng vòng lặp tạo nội dung cho trang chủ.
Sản phẩm 1
Sản phẩm 2
Sản phẩm 3
Sản phẩm 5
Sản phẩm 6
Sản phẩm 7
Sản phẩm 9
Sản phẩm 10
Sản phẩm 11

Sản phẩm 4
Sản phẩm 8
Sản phẩm 12

GỢI Ý, ĐÁP ÁN
Bài 2.2. Sử dụng vòng lặp for hoặc foreach.
Bài 2.3. Sử dụng vòng lặp for hoặc foreach, kết hợp với các thẻ HTML tạo table.

22


BÀI 3: XÂY DỰNG MODEL
Mã bài: 28.3
Giới thiệu:
Bài này giúp HSSV biết rõ về Model, kỹ năng tạo Model cho ứng dụng.
Mục tiêu:






Trình bày khái niệm và cơng dụng của Model
Biết các loại Model
Tạo được các Data Model với EF
Lập trình được các hàm đọc và cập nhật dữ liệu thông qua Model
Cẩn thận, thực hiện đúng các bước tạo Entity Data Model, khai báo đúng
thông tin kết nối đến nguồn dữ liệu

Nội dung chính:
1. Khái niệm
 Là thành phần cốt lõi của ứng dụng, có nhiệm vụ truy cập dữ liệu từ một
nguồn dữ liệu và cung cấp dữ liệu cho nguồn dữ liệu đó.

 Lưu trữ thơng tin, trạng thái của các đối tượng.
 Tất cả các nghiệp vụ logic đều được thực thi ở Model.
 Một model class trong ứng dụng ASP.NET MVC không trực tiếp xử lý đầu
vào từ trình duyệt, cũng khơng tạo ra HTML cho trình duyệt.
 Dữ liệu nhập vào từ người dùng thông qua View để kiểm tra ở Model trước
khi lưu vào CSDL.
 Model có thể được phân làm 3 loại: Data Model, Business Model và View
Model với nhiệu vụ cụ thể khác nhau.
8. Các loại Model
2.1. Data Model
 Các đối tượng trong Data Model đại diện cho các class tương tác với một
CSDL. Các class được tạo ra bởi những cơng cụ như Entity Framework
(EF).
 Các class này có thể được tạo ra từ phương pháp Database First hoặc Code
first. Ngồi ra, cũng có thể sử dụng ADO.NET để tạo thủ công.
2.2. Business Model
Các class trong Business model thường được thực hiện chức năng kiểm tra các
quy tắc nghiệp vụ hoặc xử lý nghiệp vụ (ví dụ: tính tốn chi phí vận chuyển cụ
thể cho một giỏ hàng dựa trên trọng lượng của mặt hàng được mua). Với 1 phần
23


trách nhiệm xử lý đó, các class trong business model có thể tương tác với các
class trong Data model để đọc hoặc lưu trữ dữ liệu trong CSDL.
2.3. View Model
 Các class trong View model cung cấp thông tin được truyền vào từ
controller đến view để view biết được render những gì cho trình duyệt.
Ví dụ: một class có thể chứa thông tin sản phẩm, view sử dụng class này để hiển
thị tên sản phẩm, giá bán và hình ảnh.
 Chức năng của một view model class không xử lý bất kỳ điều gì, thay vào

đó, chức năng duy nhất của nó là chứa dữ liệu và siêu dữ liệu tùy chọn
(optional metadata) giúp cho view render chính xác.
 View model cũng được sử dụng khi người dùng yêu cầu từ một view đã
được render trước đó (ví dụ: khi submit một form liên hệ)
9. Tạo Data Model
3.1. Tạo CSDL bookstore trong project
Bước 1: click chuột phải lên thư mục App_Data của project.
Bước 2: chọn Add  New Item… Xuất hiện hộp thoai.
Bước 3: Chọn Data, SQL Server Database rồi đặt tên cho CSDL rồi chọn Add.

Bước 4: thiết kế cấu trúc và nhập dữ liệu cho các table theo yêu cầu.
3.2. Tạo ADO.NET Entity Data Model
Bước 1: tạo thư mục dtModels trong thư mục Models

24