Học lập trình Asp.Net MVC 5.0 - View trong Asp.Net MVC - Visual Studio 2015 - Phần 1 - Bài số 3

Học lập trình Asp.Net MVC 5.0 - View trong Asp.Net MVC - Visual Studio 2015 - Phần 1 - Bài số 3
access_time 12/5/2015 12:00:00 AM
person Nguyễn Mạnh Hùng
1. Giới thiệu View
Trong ứng dụng Asp.Net MVC,  Views là các thành phần dùng để hiển thị giao diện người dùng (UI). Views có thể hiển thị cả các thông tin tĩnh và động, View cũng có thể hiển thị các form cho phép người sử dụng có thể cập nhật thông tin trực tiếp vào các form đó. Các Controller trong ứng dụng có thể truyền dữ liệu cho View thông qua các đối tượng như ViewData, ViewBag, TempData.
Asp.Net MVC lưu trữ các View trong thư mục Views của ứng dụng, các phương thức Action khác nhau của một lớp controller sẽ sinh ra các View khác nhau, thư mục chứa View trong ứng dụng có thể chứa nhiều các thư mục con khác, mỗi controller sẽ tạo tương ứng với 1 thư mục View có cùng tên với Controller. Ví dụ HomeController sẽ tạo ra thư mục Views > Home, các phương thức action trong HomeController như About, Contact, Index sẽ tạo ra các trang View tương ứng trong thư mục Views > Home. Controller Student sẽ tạo ra thư mục Views > Student.
 
Hình số 1 : Thư mục View tương ứng với Controller
2. View Engine.
View Engine là một phần của MVC Framework. View engine cho phép tạo ra các trang HTML kết hợp với các đoạn code mà các View engine hỗ trợ nhằm cho trình duyệt có thể hiểu và hiển thị thông tin. Asp.Net MVC Framework cung cấp 2 view engine cho phép sinh ra ra các trang HTML trong View đó là Web Form View Engine và Razor View Engine. 2.1. Tổng quát Razor View Engine
Raror: là một View Engine  mới được giới thiệu trong ASP.NET MVC 3. Đây được xem là một Engine khá tiên tiến và là lựa chọn mới cho những ai đang phát triển ứng dụng ASP.NET nói chung và chọn ASP.NET MVC nói riêng. Ngày nay khi phát triển các ứng dụng Asp.Net MVC, View Engine này được Microsoft lựa chọn mặc định khi tạo View.
Lợi ích khi sử dụng Razor : Các file trong Razor View có đuôi mở rộng là .cshtml (Sử dụng ngôn ngữ C#) hoặc .vbhtml (Sử dụng ngôn ngữ VB)
2.2 Tạo mới View
Trong khi tạo ứng dụng Asp.Net MVC, lập trình viên thường phải tạo các View nhằm giao tiếp với người sử dụng tương ứng với các phương thức Action. Khi tạo mới ứng dụng Asp.net MVC, thư mục Views mặc định được tạo sẵn trong project.
Visual Studio .Net cung cấp cách thức rất đơn giản để tạo View, trong các ví dụ ở loạt bài số 1, bài số 2 tôi đã hướng dẫn rất chi tiết về cách tạo View tương ứng với các phương thức Control. Ở bài này tôi sẽ nhắc lại quá trình tạo View để các bạn nắm rõ hơn.
Quá trình tạo View tương ứng với các phương thức Action trong controller chúng ta sẽ thực hiện qua các bước sau : Ví dụ : Tạo View từ phương thức AllStudentList của Control Student
Hình số 2 : Tạo View tương ứng với phương thức AllStudentList
Hình số 3 : Cập nhật các thông số phù hợp cho View
Lựa chọn Tên View, template và các thông số phù hợp khác cho View. Trong trường hợp này : Template chọn List (Mục tiêu hiển thị danh sách sinh view), Model class chọn Student tương ứng với Model trong ứng dụng.
Hình số 4 : Thư mục chứa View
Hình số 5 : Chỉnh sửa file View
Nội dung file View AllStudentList.cshtml cho chúng ta thấy nội dung của HTML và code của Razor được chộn lẫn, cú pháp Razor rất đơn giản, các biểu thức Razor đều bắt đầu bởi @, @Html là lớp Help cho phép tạo ra các Html control tương ứng với yêu cầu nghiệp vụ bài toán.
Hình số 6 : Razor và HTML
 
Hình số 7 : Kết quả chạy chương trình tương ứng với View

vertical_align_top
share
Chat...