Xây dựng website bán hàng MVC 4 - Bài 1 : Say Hello

-



MỤC TIÊU

  • Biết cách tạo project
  • Hiểu các thành phần Model, View, Controller và nguyên lý hoạt động của ứng dụng MVC4

MÔ TẢ

  • Trong bài này bạn phải tạo ra một ứng dụng MVC4 có hoạt động theo mô tả giao diện sau

THỰC HIỆN

  • Bước 1: Mở project mẫu
  • Bước 2: Tạo HomeController
  • Bước 3: Thiết kế View Index.cshtml
  • Bước 4: Xây dựng lớp UserInfo
  • Bước 5: Thêm Action SayHello()
  • Bước 6: Thiết kế View SayHello.cshtml


Bước 1: Mở project mẫu

Để tập trung vào phần việc chính là khai thác Entity Framework nên buổi học hôm nay cho sẵn project mẫu. Các bạn chỉ việc mở ra và bổ sung thêm mã theo yêu cầu là được.
Phải chuột vào file solution sau đó chọn VS2012 để chạy như hướng dẫn của hình sau:

Để thêm một Controller vào project, bạn chỉ việc phải chuột lên thư mục Controllers sau đó chọn Add>>Controller>>Đặt tên cho controller. Tên của một Controller phải có phần tiếp cuối ngữ là Controller.
Ví dụ: HomeController, ProductController, SupplierController là các tên hợp lệ.
Bước 2: Tạo HomeController

Bước 3: Thiết kế View Index.cshtml

Để thêm một view cho một action của một controller vào project, bạn chỉ việc mở controller đó và phải chuột lênaction>>Add View>> Đặt tên (nên giữ nguyên tên gợi ý trên hộp thoại).



Cần lưu ý ở đây là khi nhấp nút Say Hello thì dữ liệu form được chuyển đến Action SayHello() trong HomeController
Bước 4: Xây dựng lớp UserInfo
Để tiếp nhận thông tin từ form Index.cshtml và chứa thông tin để trình bày trên trang kết quả sau khi nhập nút [SayHello], bạn cần định nghĩa một lớp UserInfo gồm các thuộc tính cần thiết sau đây.

Name và Gender là 2 thuộc tính dùng để nhận thông tin từ form. Greeting và Photo được sử dụng để chứa thông tin trình bày trên trang kết quả.

Bước 5: Thêm Action SayHello()
Action này được gọi khi nhấp nút [Say Hello] trên form của Index.cshtml. Với MVC4 các tham số sẽ tự động chuyển vào các thuộc tính cùng tên trong tham số model của action SayHello(). Việc còn lại là phân tích giới tính để đưa ra lời chào và hình ảnh phù hợp để chuyển cho view kết quả (cùng tên với action –SayHello.cshtml)
Bước 6: Thiết kế View SayHello.cshtml

SayHello.cshtml là view được sử dụng để hiển thị thông tin (model) chuyển từ action SayHello(). Bạn phải tạo view này và thiết kế mã như sau:

Tải project về để thực hành nha : https://www.dropbox.com/s/sddxivoraxpb86d/ProjectMVC_HocLapTrinhWeb.com.rar
Tham khảo:  http://sinhvienit.net/forum/xay-dung-website-ban-hang-mvc-4-bai-1-say-hello.290438.html
Sưu tầm: http://nguyentuananhtn.blogspot.com/2014/01/xay-dung-website-ban-hang-mvc-4-bai-1.html 

Nhận xét

Đăng nhận xét

Bài đăng phổ biến từ blog này

Khôi phục phân vùng ổ cứng do ghost nhầm theo Hieuit.net

-
Hình ảnh
Link tải phần mềm link Google Drive (tải nhanh): https://drive.google.com/drive/folders/1A-JAxDTXcEcZ-8kWzS9lpZ2BN086Gf5L?usp=sharing Link xem hướng dẫn lấy mã giải nén phần mềm:   trên: https://docs.google.com/document/d/1P4Pp2joSl6qAtnjNieoDcU0j7Z1yqUE4/edit?usp=sharing&ouid=112212768248379981623&rtpof=true&sd=true Hôm nay mình sẽ hướng dẫn các bạn   khôi phục phân vùng ổ cứng   do ghost nhầm, chọn sai lệnh trong recovery bản quyền hệ điều hành trên laptop, xóa nhầm khi thao tác trên các phần mềm phân chia ổ cứng, chạy sai dòng lệnh diskpart. Với tỷ lệ   thành công 99% , 1% không thành công là do ổ cứng bị lỗi vật lý (bad sector đoạn chứa Partition Table), do đã dùng các công cụ khác để   khôi phục partition   nhưng không thành công và đã chia lại ổ cứng. Chỉ với 1 chút sai lầm mà bạn phải trả giá là ổ cứng với một đống dữ liệu quý giá đã “bốc hơi” và chỉ còn thấy 1 ổ đĩa duy nhất. Trong trường hợp này bạn phải bình tĩnh và cẩn thận làm theo từng bước hướng dẫn để  khôi
Đọc thêm

Cách sử dụng 2 phương thức [httppost] và [httpget] trong MVC theo https://dzungdt.wordpress.com

-
Cách sử dụng 2 phương thức [httppost] và [httpget] trong MVC Giống nhau:  Được sử dụng trên các function của controller. Attribute [httpget]: Các function mà trả về dữ liệu và được gọi như page load. Atribute [httppost]: Các function mà dữ liệu trả về sau khi form hoặc ajax gọi phương thức Post. Nếu không dùng cách này, các bạn có thể dùng phướng thức IsPost để xác định khi nào thì phường thức Post được gọi. -----------------------Tài liệu khác----------------------------------------- Sự khác biệt chính giữa GET và POST request là với HTTP GET, tất cả các tham số hay dữ liệu được chuyển đến server được chứa trong chính địa chỉ URL. Điều này có nghĩa là ta có thể gọi trực tiếp các thủ tục của server từ xa thông qua URL và các tham số của nó. Tuy nhiên, để chuyển các tham số, ta bị giới hạn bằng định dạng văn bản đơn giản với độ dài các tham số bị giới hạn bởi kích thước lớn nhất của chiều dài dòng request của máy chủ Web. Ví dụ, trên server Web Tomcat, kích thước tối đa mặc
Đọc thêm

MVC định dạng tiền tệ vnđ - Format currency vnd in MVC

-
Hình ảnh
Hi, Xin chào, I want to format currency vnd(vietnamese) in MVC and it is working for me. Step 1: In model public class MyCurrency {         [Display(Name = " Giá ")]      public decimal? Price { get; set; }       } Step 2: In View @model Demo.Web.Models.CurrencyModel @{          // define format VND     var format = System.Globalization.CultureInfo.GetCultureInfo("vi-VN");     var currency = 250000 //example } <div>       @String.Format( format , "{0:c0}",  currency  );        //hoặc nếu các bạn lấy dữ liệu từ model thì thay value bằng biến model,         //ví dụ mình thay value bằng @item.Price        // @String.Format( format , "{0:c0}",  @item.Price  ); </div> Và đây là kết quả của tôi: Trong admin tôi nhập: 1050000 Và hiển thị kết quả: Mình làm demo đơn giản để các bạn có thêm nguồn tài liệu tham khảo. Bạn có thể xem thêm các định dạng khác tại  Custom numeric format strings  hoặc  Standa
Đọc thêm