Cách tạo và hiển thị view trong ứng dụng ASP.NET MVC

Góc Kinh Nghiệm giả sử bạn đã tham khảo bài viết Hướng dẫn tạo ứng dụng ASP.NET MVC đầu tiên – và Góc Kinh Nghiệm sẽ thao tác trên project tên MyFirstMvcApplication đã được tạo ở bài biết này.

Và bây giờ, hãy cùng Góc Kinh Nghiệm tạo một view, sau đó hiển thị view trong ứng dụng MyFirstMvcApplication lên trình duyệt.

Với controller hiện tại đang có, HomeController, nó chỉ hiển thị một chuỗi text đến trình duyệt. Điều này giúp dễ dàng cho việc debugging, nhưng trong những ứng dụng thực tế, bạn có nhiều khả năng tạo một HTML document, và bạn phải làm được điều ấy bằng cách sử dụng view.

Để hiển thị được view từ phương thức Index() của bạn, đầu tiên chúng ta phải viết lại phương thức Index() trong lớp HomeController như sau:

public class HomeController : Controller
{
   public ViewResult Index()
   {
       return View();
   }
}

Bằng việc trả về một loại đối tượng tên ViewResult, bạn đưa cho MVC Framework một chỉ dẫn để hiển thị view. Bởi vì bạn đang tạo ra một đối tượng ViewResult bằng việc gọi View() không có bất kỳ tham số nào, bạn đang nói với framework để hiển thị view mặc định, hay còn được gọi là default view. Tuy nhiên, bạn thử chạy ứng dụng của bạn, bạn sẽ gặp một thông báo lỗi như hình 1 bên dưới:

Hình 1: Thông báo lỗi được hiển thị khi ASP.NET MVC không thể tìm thấy view template

Một lần nữa, Góc Kinh Nghiệm đang cho bạn thấy thông báo lỗi này vì thế bạn có thể thấy chính xác những gì framework đang cố gắng thực hiện và vì vậy bạn sẽ không nghĩ có sự chen dấu những gì xảy ra. Thông báo lỗi này rất hữu ích – framework nói với bạn rằng nó không chỉ không tìm ra view thích hợp nào để hiện thị, mà nó còn chỉ ra nơi nó cố gắng tìm kiếm view để hiển thị.

Đây là một phần qui ước thiết lập đặt tên đầu tiên của bạn: tất cả các tập tin view thường kết hợp với các phương thức action bằng một qui ước đặt tên, chứ không phải bằng cách cấu hình chính xác rõ ràng. Khi framework muốn tìm một default view hoặc một action được gọi là Index trên controller được gọi là HomeController, nó sẽ kiểm tra 4 nơi như hình 1 bên trên.

Để tạo một view cho action có tên là Index nhằm giả quyết lỗi trên hình 1, chúng ta nhấn chuột phải lên tên phương thức Index(), hoặc bất kỳ nơi nào bên trong phương thức Index() (lưu ý: nếu nhất chuột bên ngoài phương thức bạn sẽ không thấy được Add View) -> sau đó chọn Add View -> nó sẽ dẫn đến một pop-up như hình 2 bên dưới:

Hình 2: Thêm mới một view vào action tên Index

Bỏ chọn “Select master page” (bởi vì ở ví dụ này chúng ta không sử dụng master page), và sau đó nhấn nút “Add”. Nó sẽ tạo một tập tin view cho bạn tại đúng nơi mặc định cho phương thức action của bạn: ~/View/Home/Index.aspx.

HTML cũng xuất hiện trong Visual Studio, bạn sẽ thấy chúng tương tự: một trang HTML, với các element như <html>, <body>,… Chúng ta đặt chuỗi “Góc Kinh Nghiệm chào các bạn!” vào view. Thay toàn bộ nội dung trong thẻ <body> như sau:

<body>
   Góc Kinh Nghiệm chào các bạn (hiển thị từ view) !
</body>

Nhấn phím F5 để chạy ứng dụng, bạn sẽ thấy view được hiển thị như hình 3 bên dưới:

Hình 3: kết quả hiển thị từ view

Bạn và Góc Kinh Nghiệm vừa hoàn tất xong cách tạo và hiển thị view trong ứng dụng ASP.NET MVC.

Góc Kinh Nghiệm chúc các bạn thành công!  :lol:

 


5 comments

  1. Bạn quản trị có thể viết một bài làm sao để lấy dữ liệu từ database SQLSERVER theo mô hình 3 MVC rồi hiển thị nó lên màn hình không ạ. Giả sử em có bảng 2 bảng nhóm sản phẩm và bảng sản phẩm quan hệ 1 nhiều. Khi click vào 1 nhóm sản phẩm thì đưa ra danh sách các sản phẩm của nhóm đó được không ạ. Em cảm ơn rất nhiều ạ.

  2. Bạn có thể giúp mình trong 1 view cho thể gọi được 2 control bằng ajax được không. mình đang làm đồ án mà nghiên cứu 2 ngày rồi không ra đc

    1. Ứng với mỗi control bạn sẽ có một url nhất định. Bạn dùng AJAX gọi 2 url đó là ok. Bạn phải tìm hiểu thêm cách AJAX hoạt động.

Leave a Reply

Your email address will not be published. Required fields are marked *