Blog

Trong bài viết này, thiet ke website chuyen nghiep sẽ cùng các bạn tìm hiểu những tính năng trong ASP.NET MVC bằng cách xây dựng một ứng dụng data-entry đơn giản.

Thứ nhất, thiết lập ngoại cảnh:

Bài toán đặt ra: Một người bạn của bạn quyết định tổ chức một bữa party và cô ấy muốn tạo ra một ứng dụng web cho những lời ời của cô ấy vào một hệ thống RSVP điện tử. Những tính năng mà cô ấy muốn là:

  • Trang chủ để hiển thị thông tin về buổi party.
  • Form có thể sử dụng RSVP
  • Form RSVP để xác nhận và trả về lời cảm ơn của cô ấy đối với mọi người.
  • RSVPs e-mailed đến mọi người khi hoàn thành.
  • Cô ấy cần một thiết kế website giá rẻ với giao diện đơn giản nhưng đầy đủ thông tin.

Chúng ta đã biết cách tạo ra một ứng dụng ASP.NET MVC đơn giản như các bài trước đã học, các bạn có thể xem lại tại đây:

>>>ASP.NET MVC: Cách tạo một project đầu tiên.

Để giải quyết bài toàn này chúng ta sẽ xây dựng một project đơn giản và có những tính năng sau:

Xây dựng View – rất quan trọng trong thiết kế website với ASP.NET MVC:

File Index.cshtml.

Xây dựng View  trong ASP.NET MVC - Công ty thiết kế website chuyên nghiệp.

Chạy ứng dụng chúng ta sẽ có hiển thị như sau:

Kết quả chạy ứng dụng -Công ty thiết kế website chuyên nghiệp OTVINA.

Trông quá đơn giản phải không?

Nếu bạn không biết thêm view như thế nào, bạn hãy xem thêm tại: ASP.NET MVC – Tạo và tùy chỉnh một view.

Thứ hai, thiết kế mô hình dữ liệu:

Model chính là viết đầy đủ của chữ M trong MVC, đây là môt phần quan trọng của mọi ứng dụng, Model đại diện cho các đối tượng nằm trong thế giới thực, quy trình, và các quy tắc để xác định các đối tượng, được gọi là miền – domain, domain model chứa các đối tượng của C# thì gọi là domain object. Domain object chính là môi trường của ác ứng dụng và các phương thức để thao tác. Vai trò của view và controller là dẫn các domain đến các client một các logic nhất . Model tốt thì các bạn mới nên nghĩ đến việc thêm view và controllers vào.

Thứ ba, thêm lớp Model.

ASP.NET MVC quy ước rằng thư mục Models dùng để chứa các lớp Model, thư mục  này có sẵn khi chúng ta tạo một project từ VS. Add Model hoàn toàn giống với add controller, thay vì chuột phải vào thư mục Controller ta sẽ chuột phải vào thư mục Models.

Xem thêm: Tạo controller trong ASP.NET MVC.

Tôi sẽ đặt cho Model trong bài toán này là GuestResponse.cs, sau đây là code:

Code model ASP.NET MV - Công ty thiết kế website chuyên nghiệp OTVINA.

Thứ tư, liên kết phương thức hành động.

Một trong những yêu cầu là form RSVP, để có form này chúng ta cần liên kết đến View của Index.cshtml.

Sau đây là đoạn code để liên kết với @Htm.ActionLink, phương thức này trợ giúp HMTL để thuận tiện trong việc xây dựng liên kết, nhập liệu, checkbox….

Phương thức này có hai tham số, tham số thứ nhất là chuỗi hiển thị trong liên kết, tham số thứ hai là hành động sẽ xảy ra khi người dùng nhấp vào liên kết.

HTML Action Link - Công ty thiết kế website chuyên nghiệp OTVINA.

Sau khi tạo xong liên kết này chúng ta chạy chương trình sẽ có kết quả như sau:

Chạy thử chương trình với HTML ActionLink - Công ty thiet ke website chuyen nghiep OTVINA.

Khi nhấp chuột vào RSVP Now thì sẽ trỏ đến link http://yourserver/Home/RsvpForm. Đấy chính là chức năng của Html.ActionLink, nó kiểm tra định tuyến và xác định được đường dẫn cho hành động RSVP Now thực hiện trên HomeController.

Điểm khác biệt so với ASP.NET truyền thống là các URL trong MVC không tương ứng với tệp  vật lý, mỗi action method ứng với một URL riêng, MVC sử dụng hệ thống định tuyến ASP.NET để biên dịch những URLs thành hành động.

Thứ năm, tạo một phương thức hành động.

Mời các bạn xem thêm phần thứ 5 trên website của thiet ke website chuan SEO: ASP.NET MVC – Tạo Một Ứng Dụng Data Entry Đơn Giản P2.

Cảm ơn và trân trọng!