lOMoARcPSD| 58707906
BÀITHỰCHÀNHRAZORPAGE
1. Sử dụng Partial trong ứng dụng Razor page
Tạo ứng dụng Razor page
Trong thư mục Shared, tạo 1 partial (tương tự layout) có tên ProductItem
Sử dụng partial trong trang Index
Kết quả khi thực thi chương trình
lOMoARcPSD| 58707906
1.1. Truyền dữ liệu từ Model sang partial
Trong thư mục Models, tạo class Product mô tả cho thông tin sản phẩm
ProductItem.cshtml
lOMoARcPSD| 58707906
Trang Index.cshtml
Kết quả
lOMoARcPSD| 58707906
1.2. Truyền dữ liệu từ ViewData cho Partial
Tạo thêm một partial có tên _Message.cshtml
Sử dụng trong trang Index
lOMoARcPSD| 58707906
2. Sử dụng ViewComponent trong Razor page
Tạo thư mục Components trong thư mục Pages
Tạo thư mục ProductBox trong thư mục Components
Tạo file layout có tên Default.cshtml trong thư mục ProductBox
Tạo một class có tên ProductBox.cs trong thư mục ProductBox
Trong lớp ProductBox chứa một danh sách products và một trong các phương thức
Invoke như sau
lOMoARcPSD| 58707906
Trường hợp phương thức Invoke có thêm tham số
lOMoARcPSD| 58707906
lOMoARcPSD| 58707906
3. Tổ chức Service trong ứng dụng Razor page Tạo một
service có tên ProductService trong thư mục Services
Khai báo service trong tập tin Program.cs
Sử dụng service trong component ProductBox
lOMoARcPSD| 58707906
4. Model page
Thêm một Razor page có tên ProductPage vào ứng dụng
Cài đặt các phương thức Handler trên PageModel
lOMoARcPSD| 58707906
lOMoARcPSD| 58707906
Kết quả khi thực thi ứng dụng
lOMoARcPSD| 58707906
Yêu cầu thêm:
- Thêm chức năng nhập mới sản phẩm
- Tìm kiếm sản phẩm
- Cập nhật sản phẩm
5. Model Binding
* Thêm một trang ContactPage với các nội dung như sau:
- Model Contact với các thuộc tính được ràng buộc như sau:
lOMoARcPSD| 58707906
- Trang cshtml
lOMoARcPSD| 58707906
- Trang PageModel
lOMoARcPSD| 58707906
Yêu cầu thêm:
- Chỉnh lại chức năng thêm mới sản phẩm với các thuộc tính có ràng buộc dữ liệu
và validation
- Thêm tính năng upload ảnh khi thêm mới 1 sản phẩm (có thể thêm nhiều cho một
sản phẩm) 6. Access Data
Yêu cầu:
Tạo cơ sở dữ liệu quản lý bán hàng với các bảng sau:
Bảng danh mục: lưu trữ danh mục sản phẩm
Bảng sản phẩm: lưu danh sách các phẩm
Bảng User: dùng để đăng nhập
lOMoARcPSD| 58707906
Sử dụng EF để thực hiện chức năng kết nối và thao tác với dữ liệu: có thể sử
dụng một trong 2 cách code first hoặc database first để tạo liên kết giữa tầng
model và database
Hướng dẫn: slide chương 6

Preview text:

lOMoAR cPSD| 58707906
BÀITHỰCHÀNHRAZORPAGE
1. Sử dụng Partial trong ứng dụng Razor page Tạo ứng dụng Razor page
Trong thư mục Shared, tạo 1 partial (tương tự layout) có tên ProductItem
Sử dụng partial trong trang Index
Kết quả khi thực thi chương trình lOMoAR cPSD| 58707906
1.1. Truyền dữ liệu từ Model sang partial
Trong thư mục Models, tạo class Product mô tả cho thông tin sản phẩm ProductItem.cshtml lOMoAR cPSD| 58707906 Trang Index.cshtml Kết quả lOMoAR cPSD| 58707906
1.2. Truyền dữ liệu từ ViewData cho Partial
Tạo thêm một partial có tên _Message.cshtml Sử dụng trong trang Index lOMoAR cPSD| 58707906
2. Sử dụng ViewComponent trong Razor page
− Tạo thư mục Components trong thư mục Pages
− Tạo thư mục ProductBox trong thư mục Components
− Tạo file layout có tên Default.cshtml trong thư mục ProductBox
− Tạo một class có tên ProductBox.cs trong thư mục ProductBox
Trong lớp ProductBox chứa một danh sách products và một trong các phương thức Invoke như sau lOMoAR cPSD| 58707906
Trường hợp phương thức Invoke có thêm tham số lOMoAR cPSD| 58707906 lOMoAR cPSD| 58707906
3. Tổ chức Service trong ứng dụng Razor page Tạo một
service có tên ProductService trong thư mục Services
Khai báo service trong tập tin Program.cs
Sử dụng service trong component ProductBox lOMoAR cPSD| 58707906 4. Model page
Thêm một Razor page có tên ProductPage vào ứng dụng
Cài đặt các phương thức Handler trên PageModel lOMoAR cPSD| 58707906 lOMoAR cPSD| 58707906
Kết quả khi thực thi ứng dụng lOMoAR cPSD| 58707906 Yêu cầu thêm:
- Thêm chức năng nhập mới sản phẩm - Tìm kiếm sản phẩm - Cập nhật sản phẩm 5. Model Binding
* Thêm một trang ContactPage với các nội dung như sau:
- Model Contact với các thuộc tính được ràng buộc như sau: lOMoAR cPSD| 58707906 - Trang cshtml lOMoAR cPSD| 58707906 - Trang PageModel lOMoAR cPSD| 58707906 Yêu cầu thêm:
- Chỉnh lại chức năng thêm mới sản phẩm với các thuộc tính có ràng buộc dữ liệu và validation
- Thêm tính năng upload ảnh khi thêm mới 1 sản phẩm (có thể thêm nhiều cho một
sản phẩm) 6. Access Data Yêu cầu:
● Tạo cơ sở dữ liệu quản lý bán hàng với các bảng sau:
Bảng danh mục: lưu trữ danh mục sản phẩm
Bảng sản phẩm: lưu danh sách các phẩm
Bảng User: dùng để đăng nhập lOMoAR cPSD| 58707906
● Sử dụng EF để thực hiện chức năng kết nối và thao tác với dữ liệu: có thể sử
dụng một trong 2 cách code first hoặc database first để tạo liên kết giữa tầng model và database
Hướng dẫn: slide chương 6