SlideShare a Scribd company logo
1 of 51
Download to read offline
1
CHƢƠNG 6:
SINH GIAO DIỆN VÀ CHIA SẺ DỮ LIỆU
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
LẬP TRÌNH WEBSITE
(ASP.NET MVC 5)
 Giảng Viên: ThS. Dƣơng Thành Phết
 Email: phetcm@gmail.com
 Website: http://www.thayphet.net
 Mobile: 0918158670
KHOA CÔNG NGHỆ THÔNG TIN
2
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
NỘI DUNG
1. Razor
2. MVC Helper
3. Sinh giao diện theo Model
4. Custom Helper
5. ViewBag, Model
6. Session
7. Application
8. Cookie
9. Global.asax
3
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
1. RAZOR
 Razor là ngôn ngữ ngắn gọn, rỏ ràng và hữu ích cho
phép tạo ra các giao diện ứng dụng ASP.NET MVC
 Trong khối lệnh @{…} là mã C# hoặc VB.NET trộn HTML
1.1. Razor là gì?
4
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
1. RAZOR
1.2. Cú pháp:
5
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
1. RAZOR
1.2. Cú pháp:
6
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
2. MVC HELPER - SINH GIAO DIỆN
2.1. Helper là gì?
7
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
2. MVC HELPER - SINH GIAO DIỆN
2.2. HyperLink Helpers:
8
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
2. MVC HELPER - SINH GIAO DIỆN
2.3. Form Field Helpers:
9
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
2. MVC HELPER - SINH GIAO DIỆN
2.3. Form Field Helpers:
10
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
2. MVC HELPER - SINH GIAO DIỆN
2.4. DropDownList & ListBox
11
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
2. MVC HELPER - SINH GIAO DIỆN
2.5. Sinh mã HTML
12
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
2. MVC HELPER - SINH GIAO DIỆN
2.6. Sinh Form
13
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
2. MVC HELPER - SINH GIAO DIỆN
2.7. Helper định dạng
14
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
2. MVC HELPER - SINH GIAO DIỆN
2.7.1 Helper định dạng số
15
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
2. MVC HELPER - SINH GIAO DIỆN
2.7.2 Helper định dạng thời gian
16
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
2. MVC HELPER - SINH GIAO DIỆN
2.8. Mã hóa HTML
17
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
3. SINH GIAO DIỆN THEO MODEL
3.1. Sinh giao diện động
18
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
3. SINH GIAO DIỆN THEO MODEL
3.2. Sinh giao tƣờng minh
19
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
3. SINH GIAO DIỆN THEO MODEL
3.3. View
20
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
3. SINH GIAO DIỆN THEO MODEL
3.4. Sinh giao diện ngầm định
21
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
3. SINH GIAO DIỆN THEO MODEL
3.4. Sinh giao diện ngầm định
22
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
3. SINH GIAO DIỆN THEO MODEL
3.5. Kiểu Control
23
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
3. SINH GIAO DIỆN THEO MODEL
3.6. Hiển thị thông tin
24
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
4. CUSTOM HELPER
 Bên cạnh các helper dựng sẵn, bạn có thể tạo cho mình
các helper có mục đích cho riêng mình.
 Trong MVC có 3 phương pháp tạo helper tùy biến
25
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
4. CUSTOM HELPER
4.1. Phƣơng thức tĩnh
26
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
4. CUSTOM HELPER
4.2. HTML Helper tùy biến
27
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
4. CUSTOM HELPER
4.3. Mở rộng HTML Helper
28
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
4. CUSTOM HELPER
4.3. Mở rộng HTML Helper
29
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
4. CUSTOM HELPER
4.4. Sử dụng Helper
30
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
4. CUSTOM HELPER
4.5. Sử dụng @Helper
31
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
5. VIEWBAG, MODEL
ViewBag/ViewData và Model được sử dụng để chia sẻ dữ
liệu giữa Controller và View
32
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
5. VIEWBAG, MODEL
ViewBag/ViewData
Đã được sử dụng để truyền dữ liệu từ Controller sang
View. View sẽ sử dụng để xây dựng giao diện phù hợp
trả lại cho người dùng.
33
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
5. VIEWBAG, MODEL
Model
34
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
5. VIEWBAG, MODEL
Khai báo kiểu dữ liệu của Model
Chú ý: phân biệt @model và @Model
 @model: Dùng để khai báo kiểu của @Model
 @Model: Đối tượng chứa dữ liệu truyền từ Controller
35
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
5. VIEWBAG, MODEL
Chia sẽ với Model
36
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
5. VIEWBAG, MODEL
Minh họa: ProductList
37
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
5. VIEWBAG, MODEL
Minh họa: ProductDetail
38
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
6. CHIA SẺ DỮ LIỆU THEO PHIÊN - SESSION
 Phiên làm việc (session) được tính từ lúc bắt đầu truy
cập website cho đến khi đóng cửa sổ trình duyệt hoặc
hết hạn sử dụng.
 Dữ liệu được lưu vào session sẽ được duy trì trong suốt
phiên làm việc và được truy cập bởi bất kz thành phần
nào hoạt động trong phiển làm việc đó.
39
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
6. CHIA SẺ DỮ LIỆU THEO PHIÊN - SESSION
Ứng dụng:
 Duy trì giỏ hàng: giỏ hàng cần duy trì trong suốt quá trình
tìm kiếm và chọn mua hàng hóa.
 Duy trì tài khoản đăng nhập: tài khoản đăng nhập cần
được duy trì trong suốt phiên làm việc để khi cần có thể
sử dụng.
Mã lấy đối tƣợng session:
40
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
6. CHIA SẺ DỮ LIỆU THEO PHIÊN - SESSION
Thao tác Session:
41
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
6. CHIA SẺ DỮ LIỆU THEO PHIÊN - SESSION
Minh họa:
 Shopping Cart: duy trì danh sách hàng đã chọn
trong session
 CRUD: duy trì dữ liệu trong List
42
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
7. APPLICATION
43
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
7. APPLICATION
Application Scope
44
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
7. APPLICATION
Minh họa:
 Bộ đến khách thăm web
 Chat
 Queue mails
45
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
8. COOKIE
 Cookie là mẫu tin nhỏ được lưu trên máy client và truyền
thông với server trong các request vàresponse.
 Ứng dụng: Chia sẻ dữ liệu giữa các trang trong website
được truy cập từ máy
 Tài khoản đăng nhập
 Hàng hóa đã xem
46
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
8. COOKIE
47
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
8. COOKIE
Cookie API
48
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
8. COOKIE
Minh họa:
Duy trì hàng hóa đã xem
49
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
9. GLOBAL.ASAX
50
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net
Minh họa:
HitCounter
9. GLOBAL.ASAX
51
HẾT CHƢƠNG 6
© Dương Thành Phết phetcm@gmail.com - www.thayphet.net

More Related Content

Similar to 06 chuong06sinhgiaodienvachiasedulieu

Slide2 - Co ban HTML5
Slide2 - Co ban HTML5Slide2 - Co ban HTML5
Slide2 - Co ban HTML5Đặng Til
 
BÀI 5 Tối ưu hóa thiết kế web và cách làm việc cơ bản trong chế độ hiển thị C...
BÀI 5 Tối ưu hóa thiết kế web và cách làm việc cơ bản trong chế độ hiển thị C...BÀI 5 Tối ưu hóa thiết kế web và cách làm việc cơ bản trong chế độ hiển thị C...
BÀI 5 Tối ưu hóa thiết kế web và cách làm việc cơ bản trong chế độ hiển thị C...MasterCode.vn
 
Website mua bán trực tiếp.pdf
Website mua bán trực tiếp.pdfWebsite mua bán trực tiếp.pdf
Website mua bán trực tiếp.pdfPhngNN
 
NHÓM 1010_ĐỒ ÁN LẬP TRÌNH WEB .docx.pptx
NHÓM 1010_ĐỒ ÁN LẬP TRÌNH WEB .docx.pptxNHÓM 1010_ĐỒ ÁN LẬP TRÌNH WEB .docx.pptx
NHÓM 1010_ĐỒ ÁN LẬP TRÌNH WEB .docx.pptxPhuongPhan826909
 
[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệp
[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệp[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệp
[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệpPhạm Văn Hưng
 
Power point template
Power point templatePower point template
Power point templateanh135
 
slide đồ án cs1.pptx
slide đồ án cs1.pptxslide đồ án cs1.pptx
slide đồ án cs1.pptxHuyDng88
 
Báo cáo hoan chỉnh
Báo cáo hoan chỉnhBáo cáo hoan chỉnh
Báo cáo hoan chỉnhCuong Nguyen
 
[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tập
[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tập[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tập
[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tậpnnn4194a
 
Lap trinh web la gi bat dau hoc lap trinh web tu dau
Lap trinh web la gi bat dau hoc lap trinh web tu dauLap trinh web la gi bat dau hoc lap trinh web tu dau
Lap trinh web la gi bat dau hoc lap trinh web tu dautuananh1896
 
Autodesk Revit MEP Mechanical Review for Autodesk Certified Professional
Autodesk Revit MEP Mechanical Review for Autodesk Certified ProfessionalAutodesk Revit MEP Mechanical Review for Autodesk Certified Professional
Autodesk Revit MEP Mechanical Review for Autodesk Certified ProfessionalChâu Hải
 
Báo cáo hoan chỉnh
Báo cáo hoan chỉnhBáo cáo hoan chỉnh
Báo cáo hoan chỉnhCuong Nguyen
 
Bài giảng thiết kế website - truongkinhtethucpham.com
Bài giảng thiết kế website - truongkinhtethucpham.comBài giảng thiết kế website - truongkinhtethucpham.com
Bài giảng thiết kế website - truongkinhtethucpham.commai_non
 
Cv le hoang anh
Cv   le hoang anhCv   le hoang anh
Cv le hoang anhThem Dao
 
Ngược lên dòng trên
Ngược lên dòng trênNgược lên dòng trên
Ngược lên dòng trênTruong Tuan
 
Đồ án Quản lý học sinh trường THPT
Đồ án Quản lý học sinh trường THPTĐồ án Quản lý học sinh trường THPT
Đồ án Quản lý học sinh trường THPTAliza Rogahn
 

Similar to 06 chuong06sinhgiaodienvachiasedulieu (20)

Slide2 - Co ban HTML5
Slide2 - Co ban HTML5Slide2 - Co ban HTML5
Slide2 - Co ban HTML5
 
Slide2
Slide2Slide2
Slide2
 
BÀI 5 Tối ưu hóa thiết kế web và cách làm việc cơ bản trong chế độ hiển thị C...
BÀI 5 Tối ưu hóa thiết kế web và cách làm việc cơ bản trong chế độ hiển thị C...BÀI 5 Tối ưu hóa thiết kế web và cách làm việc cơ bản trong chế độ hiển thị C...
BÀI 5 Tối ưu hóa thiết kế web và cách làm việc cơ bản trong chế độ hiển thị C...
 
Slide5
Slide5Slide5
Slide5
 
Website mua bán trực tiếp.pdf
Website mua bán trực tiếp.pdfWebsite mua bán trực tiếp.pdf
Website mua bán trực tiếp.pdf
 
Yii
YiiYii
Yii
 
NHÓM 1010_ĐỒ ÁN LẬP TRÌNH WEB .docx.pptx
NHÓM 1010_ĐỒ ÁN LẬP TRÌNH WEB .docx.pptxNHÓM 1010_ĐỒ ÁN LẬP TRÌNH WEB .docx.pptx
NHÓM 1010_ĐỒ ÁN LẬP TRÌNH WEB .docx.pptx
 
[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệp
[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệp[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệp
[Bachkhoa-Aptech] Hướng dẫn lập trình web doanh nghiệp
 
Power point template
Power point templatePower point template
Power point template
 
slide đồ án cs1.pptx
slide đồ án cs1.pptxslide đồ án cs1.pptx
slide đồ án cs1.pptx
 
Báo cáo hoan chỉnh
Báo cáo hoan chỉnhBáo cáo hoan chỉnh
Báo cáo hoan chỉnh
 
[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tập
[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tập[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tập
[Athena] Nguyễn Nhật Nguyên - Báo cáo thực tập
 
Lap trinh web la gi bat dau hoc lap trinh web tu dau
Lap trinh web la gi bat dau hoc lap trinh web tu dauLap trinh web la gi bat dau hoc lap trinh web tu dau
Lap trinh web la gi bat dau hoc lap trinh web tu dau
 
Autodesk Revit MEP Mechanical Review for Autodesk Certified Professional
Autodesk Revit MEP Mechanical Review for Autodesk Certified ProfessionalAutodesk Revit MEP Mechanical Review for Autodesk Certified Professional
Autodesk Revit MEP Mechanical Review for Autodesk Certified Professional
 
Luận văn: Xây dựng website đa ngôn ngữ cho Công ty, HOT
Luận văn: Xây dựng website đa ngôn ngữ cho Công ty, HOTLuận văn: Xây dựng website đa ngôn ngữ cho Công ty, HOT
Luận văn: Xây dựng website đa ngôn ngữ cho Công ty, HOT
 
Báo cáo hoan chỉnh
Báo cáo hoan chỉnhBáo cáo hoan chỉnh
Báo cáo hoan chỉnh
 
Bài giảng thiết kế website - truongkinhtethucpham.com
Bài giảng thiết kế website - truongkinhtethucpham.comBài giảng thiết kế website - truongkinhtethucpham.com
Bài giảng thiết kế website - truongkinhtethucpham.com
 
Cv le hoang anh
Cv   le hoang anhCv   le hoang anh
Cv le hoang anh
 
Ngược lên dòng trên
Ngược lên dòng trênNgược lên dòng trên
Ngược lên dòng trên
 
Đồ án Quản lý học sinh trường THPT
Đồ án Quản lý học sinh trường THPTĐồ án Quản lý học sinh trường THPT
Đồ án Quản lý học sinh trường THPT
 

Recently uploaded

Đồ án tốt nghiệp Nghiên cứu ứng dụng enzyme protease thương mại Tegalase R660...
Đồ án tốt nghiệp Nghiên cứu ứng dụng enzyme protease thương mại Tegalase R660...Đồ án tốt nghiệp Nghiên cứu ứng dụng enzyme protease thương mại Tegalase R660...
Đồ án tốt nghiệp Nghiên cứu ứng dụng enzyme protease thương mại Tegalase R660...lamluanvan.net Viết thuê luận văn
 
Đồ án Năng lượng gió, đi sâu tìm hiểu hệ thống điện năng lượng gió
Đồ án Năng lượng gió, đi sâu tìm hiểu hệ thống điện năng lượng gióĐồ án Năng lượng gió, đi sâu tìm hiểu hệ thống điện năng lượng gió
Đồ án Năng lượng gió, đi sâu tìm hiểu hệ thống điện năng lượng giólamluanvan.net Viết thuê luận văn
 
Đồ án Nghiên cứu quá trình sản xuất của nhà máy nước. Đi sâu hệ thống ổn định...
Đồ án Nghiên cứu quá trình sản xuất của nhà máy nước. Đi sâu hệ thống ổn định...Đồ án Nghiên cứu quá trình sản xuất của nhà máy nước. Đi sâu hệ thống ổn định...
Đồ án Nghiên cứu quá trình sản xuất của nhà máy nước. Đi sâu hệ thống ổn định...lamluanvan.net Viết thuê luận văn
 
Đồ án Nghiên cứu các loại máy phát điện, đi sâu phân tích hệ thống ổn định đi...
Đồ án Nghiên cứu các loại máy phát điện, đi sâu phân tích hệ thống ổn định đi...Đồ án Nghiên cứu các loại máy phát điện, đi sâu phân tích hệ thống ổn định đi...
Đồ án Nghiên cứu các loại máy phát điện, đi sâu phân tích hệ thống ổn định đi...lamluanvan.net Viết thuê luận văn
 
Đồ án Nghiên cứu, tìm hiểu phân tích nguyên lý hoạt động của một số máy cán t...
Đồ án Nghiên cứu, tìm hiểu phân tích nguyên lý hoạt động của một số máy cán t...Đồ án Nghiên cứu, tìm hiểu phân tích nguyên lý hoạt động của một số máy cán t...
Đồ án Nghiên cứu, tìm hiểu phân tích nguyên lý hoạt động của một số máy cán t...lamluanvan.net Viết thuê luận văn
 
Đồ án Pin mặt trời, tìm hiểu phương pháp đảm bảo công suất tối đa của dàn pin...
Đồ án Pin mặt trời, tìm hiểu phương pháp đảm bảo công suất tối đa của dàn pin...Đồ án Pin mặt trời, tìm hiểu phương pháp đảm bảo công suất tối đa của dàn pin...
Đồ án Pin mặt trời, tìm hiểu phương pháp đảm bảo công suất tối đa của dàn pin...lamluanvan.net Viết thuê luận văn
 
Đồ án tốt nghiệp Nghiên cứu so sánh hiệu quả xử lý dầu khoáng của một số loại...
Đồ án tốt nghiệp Nghiên cứu so sánh hiệu quả xử lý dầu khoáng của một số loại...Đồ án tốt nghiệp Nghiên cứu so sánh hiệu quả xử lý dầu khoáng của một số loại...
Đồ án tốt nghiệp Nghiên cứu so sánh hiệu quả xử lý dầu khoáng của một số loại...lamluanvan.net Viết thuê luận văn
 
ĐỒ ÁN NGHIÊN CỨU CÁC GIẢI PHÁP THIẾT KẾ NGÔI NHÀ THÔNG MINH
ĐỒ ÁN NGHIÊN CỨU CÁC GIẢI PHÁP THIẾT KẾ NGÔI NHÀ THÔNG MINHĐỒ ÁN NGHIÊN CỨU CÁC GIẢI PHÁP THIẾT KẾ NGÔI NHÀ THÔNG MINH
ĐỒ ÁN NGHIÊN CỨU CÁC GIẢI PHÁP THIẾT KẾ NGÔI NHÀ THÔNG MINHlamluanvan.net Viết thuê luận văn
 
Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất snack từ rong nâu Sargassum po...
Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất snack từ rong nâu Sargassum po...Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất snack từ rong nâu Sargassum po...
Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất snack từ rong nâu Sargassum po...lamluanvan.net Viết thuê luận văn
 
Đồ án Thiết kế chế tạo máy rửa tay sát khuẩn tự động sử dụng chip Arduino
Đồ án Thiết kế chế tạo máy rửa tay sát khuẩn tự động sử dụng chip ArduinoĐồ án Thiết kế chế tạo máy rửa tay sát khuẩn tự động sử dụng chip Arduino
Đồ án Thiết kế chế tạo máy rửa tay sát khuẩn tự động sử dụng chip Arduinolamluanvan.net Viết thuê luận văn
 
Đồ án tốt nghiệp Nghiên cứu phương pháp oxy hóa bậc cao hệ Fenton trong xử lý...
Đồ án tốt nghiệp Nghiên cứu phương pháp oxy hóa bậc cao hệ Fenton trong xử lý...Đồ án tốt nghiệp Nghiên cứu phương pháp oxy hóa bậc cao hệ Fenton trong xử lý...
Đồ án tốt nghiệp Nghiên cứu phương pháp oxy hóa bậc cao hệ Fenton trong xử lý...lamluanvan.net Viết thuê luận văn
 
Đồ án tốt nghiệp Nghiên cứu khả năng keo tụ của Sắt Sunfate kết hợp với Canxi...
Đồ án tốt nghiệp Nghiên cứu khả năng keo tụ của Sắt Sunfate kết hợp với Canxi...Đồ án tốt nghiệp Nghiên cứu khả năng keo tụ của Sắt Sunfate kết hợp với Canxi...
Đồ án tốt nghiệp Nghiên cứu khả năng keo tụ của Sắt Sunfate kết hợp với Canxi...lamluanvan.net Viết thuê luận văn
 
Đồ án Thiết kế hệ thống điều khiển tốc độ động cơ một chiều bằng các bộ điều ...
Đồ án Thiết kế hệ thống điều khiển tốc độ động cơ một chiều bằng các bộ điều ...Đồ án Thiết kế hệ thống điều khiển tốc độ động cơ một chiều bằng các bộ điều ...
Đồ án Thiết kế hệ thống điều khiển tốc độ động cơ một chiều bằng các bộ điều ...lamluanvan.net Viết thuê luận văn
 
Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất cà phê nấm linh chi (Ganoderma...
Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất cà phê nấm linh chi (Ganoderma...Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất cà phê nấm linh chi (Ganoderma...
Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất cà phê nấm linh chi (Ganoderma...lamluanvan.net Viết thuê luận văn
 
Đồ án Tìm hiểu năng lượng tái tạo và thuật toán INC bám điểm công suất cực đạ...
Đồ án Tìm hiểu năng lượng tái tạo và thuật toán INC bám điểm công suất cực đạ...Đồ án Tìm hiểu năng lượng tái tạo và thuật toán INC bám điểm công suất cực đạ...
Đồ án Tìm hiểu năng lượng tái tạo và thuật toán INC bám điểm công suất cực đạ...lamluanvan.net Viết thuê luận văn
 
Đồ án Kỹ thuật thực phẩm Tính toán thiết kế thiết bị sấy thùng quay sấy đậu x...
Đồ án Kỹ thuật thực phẩm Tính toán thiết kế thiết bị sấy thùng quay sấy đậu x...Đồ án Kỹ thuật thực phẩm Tính toán thiết kế thiết bị sấy thùng quay sấy đậu x...
Đồ án Kỹ thuật thực phẩm Tính toán thiết kế thiết bị sấy thùng quay sấy đậu x...lamluanvan.net Viết thuê luận văn
 

Recently uploaded (20)

Đồ án tốt nghiệp Nghiên cứu ứng dụng enzyme protease thương mại Tegalase R660...
Đồ án tốt nghiệp Nghiên cứu ứng dụng enzyme protease thương mại Tegalase R660...Đồ án tốt nghiệp Nghiên cứu ứng dụng enzyme protease thương mại Tegalase R660...
Đồ án tốt nghiệp Nghiên cứu ứng dụng enzyme protease thương mại Tegalase R660...
 
Đồ án Năng lượng gió, đi sâu tìm hiểu hệ thống điện năng lượng gió
Đồ án Năng lượng gió, đi sâu tìm hiểu hệ thống điện năng lượng gióĐồ án Năng lượng gió, đi sâu tìm hiểu hệ thống điện năng lượng gió
Đồ án Năng lượng gió, đi sâu tìm hiểu hệ thống điện năng lượng gió
 
Đồ án Nghiên cứu quá trình sản xuất của nhà máy nước. Đi sâu hệ thống ổn định...
Đồ án Nghiên cứu quá trình sản xuất của nhà máy nước. Đi sâu hệ thống ổn định...Đồ án Nghiên cứu quá trình sản xuất của nhà máy nước. Đi sâu hệ thống ổn định...
Đồ án Nghiên cứu quá trình sản xuất của nhà máy nước. Đi sâu hệ thống ổn định...
 
Đồ án Nghiên cứu các loại máy phát điện, đi sâu phân tích hệ thống ổn định đi...
Đồ án Nghiên cứu các loại máy phát điện, đi sâu phân tích hệ thống ổn định đi...Đồ án Nghiên cứu các loại máy phát điện, đi sâu phân tích hệ thống ổn định đi...
Đồ án Nghiên cứu các loại máy phát điện, đi sâu phân tích hệ thống ổn định đi...
 
Đồ án Nghiên cứu, tìm hiểu phân tích nguyên lý hoạt động của một số máy cán t...
Đồ án Nghiên cứu, tìm hiểu phân tích nguyên lý hoạt động của một số máy cán t...Đồ án Nghiên cứu, tìm hiểu phân tích nguyên lý hoạt động của một số máy cán t...
Đồ án Nghiên cứu, tìm hiểu phân tích nguyên lý hoạt động của một số máy cán t...
 
ĐỒ ÁN TỐT NGHIỆP HỆ THỐNG VƯỜN THÔNG MINH.doc
ĐỒ ÁN TỐT NGHIỆP HỆ THỐNG VƯỜN THÔNG MINH.docĐỒ ÁN TỐT NGHIỆP HỆ THỐNG VƯỜN THÔNG MINH.doc
ĐỒ ÁN TỐT NGHIỆP HỆ THỐNG VƯỜN THÔNG MINH.doc
 
Đồ án Pin mặt trời, tìm hiểu phương pháp đảm bảo công suất tối đa của dàn pin...
Đồ án Pin mặt trời, tìm hiểu phương pháp đảm bảo công suất tối đa của dàn pin...Đồ án Pin mặt trời, tìm hiểu phương pháp đảm bảo công suất tối đa của dàn pin...
Đồ án Pin mặt trời, tìm hiểu phương pháp đảm bảo công suất tối đa của dàn pin...
 
ĐỒ ÁN THIẾT BỊ HỖ TRỢ NGƯỜI KHIẾM THỊ.doc
ĐỒ ÁN THIẾT BỊ HỖ TRỢ NGƯỜI KHIẾM THỊ.docĐỒ ÁN THIẾT BỊ HỖ TRỢ NGƯỜI KHIẾM THỊ.doc
ĐỒ ÁN THIẾT BỊ HỖ TRỢ NGƯỜI KHIẾM THỊ.doc
 
Đồ án tốt nghiệp Nghiên cứu so sánh hiệu quả xử lý dầu khoáng của một số loại...
Đồ án tốt nghiệp Nghiên cứu so sánh hiệu quả xử lý dầu khoáng của một số loại...Đồ án tốt nghiệp Nghiên cứu so sánh hiệu quả xử lý dầu khoáng của một số loại...
Đồ án tốt nghiệp Nghiên cứu so sánh hiệu quả xử lý dầu khoáng của một số loại...
 
ĐỒ ÁN TRIỂN KHAI GIẢI PHÁP VPN TRÊN FIREWALL CISCO ASA
ĐỒ ÁN TRIỂN KHAI GIẢI PHÁP VPN TRÊN FIREWALL CISCO ASAĐỒ ÁN TRIỂN KHAI GIẢI PHÁP VPN TRÊN FIREWALL CISCO ASA
ĐỒ ÁN TRIỂN KHAI GIẢI PHÁP VPN TRÊN FIREWALL CISCO ASA
 
ĐỒ ÁN NGHIÊN CỨU CÁC GIẢI PHÁP THIẾT KẾ NGÔI NHÀ THÔNG MINH
ĐỒ ÁN NGHIÊN CỨU CÁC GIẢI PHÁP THIẾT KẾ NGÔI NHÀ THÔNG MINHĐỒ ÁN NGHIÊN CỨU CÁC GIẢI PHÁP THIẾT KẾ NGÔI NHÀ THÔNG MINH
ĐỒ ÁN NGHIÊN CỨU CÁC GIẢI PHÁP THIẾT KẾ NGÔI NHÀ THÔNG MINH
 
Đồ án Giám sát hệ thống đèn chiếu sáng.doc
Đồ án Giám sát hệ thống đèn chiếu sáng.docĐồ án Giám sát hệ thống đèn chiếu sáng.doc
Đồ án Giám sát hệ thống đèn chiếu sáng.doc
 
Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất snack từ rong nâu Sargassum po...
Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất snack từ rong nâu Sargassum po...Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất snack từ rong nâu Sargassum po...
Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất snack từ rong nâu Sargassum po...
 
Đồ án Thiết kế chế tạo máy rửa tay sát khuẩn tự động sử dụng chip Arduino
Đồ án Thiết kế chế tạo máy rửa tay sát khuẩn tự động sử dụng chip ArduinoĐồ án Thiết kế chế tạo máy rửa tay sát khuẩn tự động sử dụng chip Arduino
Đồ án Thiết kế chế tạo máy rửa tay sát khuẩn tự động sử dụng chip Arduino
 
Đồ án tốt nghiệp Nghiên cứu phương pháp oxy hóa bậc cao hệ Fenton trong xử lý...
Đồ án tốt nghiệp Nghiên cứu phương pháp oxy hóa bậc cao hệ Fenton trong xử lý...Đồ án tốt nghiệp Nghiên cứu phương pháp oxy hóa bậc cao hệ Fenton trong xử lý...
Đồ án tốt nghiệp Nghiên cứu phương pháp oxy hóa bậc cao hệ Fenton trong xử lý...
 
Đồ án tốt nghiệp Nghiên cứu khả năng keo tụ của Sắt Sunfate kết hợp với Canxi...
Đồ án tốt nghiệp Nghiên cứu khả năng keo tụ của Sắt Sunfate kết hợp với Canxi...Đồ án tốt nghiệp Nghiên cứu khả năng keo tụ của Sắt Sunfate kết hợp với Canxi...
Đồ án tốt nghiệp Nghiên cứu khả năng keo tụ của Sắt Sunfate kết hợp với Canxi...
 
Đồ án Thiết kế hệ thống điều khiển tốc độ động cơ một chiều bằng các bộ điều ...
Đồ án Thiết kế hệ thống điều khiển tốc độ động cơ một chiều bằng các bộ điều ...Đồ án Thiết kế hệ thống điều khiển tốc độ động cơ một chiều bằng các bộ điều ...
Đồ án Thiết kế hệ thống điều khiển tốc độ động cơ một chiều bằng các bộ điều ...
 
Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất cà phê nấm linh chi (Ganoderma...
Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất cà phê nấm linh chi (Ganoderma...Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất cà phê nấm linh chi (Ganoderma...
Đồ án tốt nghiệp Nghiên cứu quy trình sản xuất cà phê nấm linh chi (Ganoderma...
 
Đồ án Tìm hiểu năng lượng tái tạo và thuật toán INC bám điểm công suất cực đạ...
Đồ án Tìm hiểu năng lượng tái tạo và thuật toán INC bám điểm công suất cực đạ...Đồ án Tìm hiểu năng lượng tái tạo và thuật toán INC bám điểm công suất cực đạ...
Đồ án Tìm hiểu năng lượng tái tạo và thuật toán INC bám điểm công suất cực đạ...
 
Đồ án Kỹ thuật thực phẩm Tính toán thiết kế thiết bị sấy thùng quay sấy đậu x...
Đồ án Kỹ thuật thực phẩm Tính toán thiết kế thiết bị sấy thùng quay sấy đậu x...Đồ án Kỹ thuật thực phẩm Tính toán thiết kế thiết bị sấy thùng quay sấy đậu x...
Đồ án Kỹ thuật thực phẩm Tính toán thiết kế thiết bị sấy thùng quay sấy đậu x...
 

06 chuong06sinhgiaodienvachiasedulieu

  • 1. 1 CHƢƠNG 6: SINH GIAO DIỆN VÀ CHIA SẺ DỮ LIỆU © Dương Thành Phết phetcm@gmail.com - www.thayphet.net LẬP TRÌNH WEBSITE (ASP.NET MVC 5)  Giảng Viên: ThS. Dƣơng Thành Phết  Email: phetcm@gmail.com  Website: http://www.thayphet.net  Mobile: 0918158670 KHOA CÔNG NGHỆ THÔNG TIN
  • 2. 2 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net NỘI DUNG 1. Razor 2. MVC Helper 3. Sinh giao diện theo Model 4. Custom Helper 5. ViewBag, Model 6. Session 7. Application 8. Cookie 9. Global.asax
  • 3. 3 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 1. RAZOR  Razor là ngôn ngữ ngắn gọn, rỏ ràng và hữu ích cho phép tạo ra các giao diện ứng dụng ASP.NET MVC  Trong khối lệnh @{…} là mã C# hoặc VB.NET trộn HTML 1.1. Razor là gì?
  • 4. 4 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 1. RAZOR 1.2. Cú pháp:
  • 5. 5 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 1. RAZOR 1.2. Cú pháp:
  • 6. 6 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 2. MVC HELPER - SINH GIAO DIỆN 2.1. Helper là gì?
  • 7. 7 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 2. MVC HELPER - SINH GIAO DIỆN 2.2. HyperLink Helpers:
  • 8. 8 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 2. MVC HELPER - SINH GIAO DIỆN 2.3. Form Field Helpers:
  • 9. 9 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 2. MVC HELPER - SINH GIAO DIỆN 2.3. Form Field Helpers:
  • 10. 10 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 2. MVC HELPER - SINH GIAO DIỆN 2.4. DropDownList & ListBox
  • 11. 11 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 2. MVC HELPER - SINH GIAO DIỆN 2.5. Sinh mã HTML
  • 12. 12 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 2. MVC HELPER - SINH GIAO DIỆN 2.6. Sinh Form
  • 13. 13 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 2. MVC HELPER - SINH GIAO DIỆN 2.7. Helper định dạng
  • 14. 14 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 2. MVC HELPER - SINH GIAO DIỆN 2.7.1 Helper định dạng số
  • 15. 15 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 2. MVC HELPER - SINH GIAO DIỆN 2.7.2 Helper định dạng thời gian
  • 16. 16 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 2. MVC HELPER - SINH GIAO DIỆN 2.8. Mã hóa HTML
  • 17. 17 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 3. SINH GIAO DIỆN THEO MODEL 3.1. Sinh giao diện động
  • 18. 18 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 3. SINH GIAO DIỆN THEO MODEL 3.2. Sinh giao tƣờng minh
  • 19. 19 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 3. SINH GIAO DIỆN THEO MODEL 3.3. View
  • 20. 20 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 3. SINH GIAO DIỆN THEO MODEL 3.4. Sinh giao diện ngầm định
  • 21. 21 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 3. SINH GIAO DIỆN THEO MODEL 3.4. Sinh giao diện ngầm định
  • 22. 22 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 3. SINH GIAO DIỆN THEO MODEL 3.5. Kiểu Control
  • 23. 23 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 3. SINH GIAO DIỆN THEO MODEL 3.6. Hiển thị thông tin
  • 24. 24 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 4. CUSTOM HELPER  Bên cạnh các helper dựng sẵn, bạn có thể tạo cho mình các helper có mục đích cho riêng mình.  Trong MVC có 3 phương pháp tạo helper tùy biến
  • 25. 25 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 4. CUSTOM HELPER 4.1. Phƣơng thức tĩnh
  • 26. 26 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 4. CUSTOM HELPER 4.2. HTML Helper tùy biến
  • 27. 27 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 4. CUSTOM HELPER 4.3. Mở rộng HTML Helper
  • 28. 28 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 4. CUSTOM HELPER 4.3. Mở rộng HTML Helper
  • 29. 29 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 4. CUSTOM HELPER 4.4. Sử dụng Helper
  • 30. 30 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 4. CUSTOM HELPER 4.5. Sử dụng @Helper
  • 31. 31 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 5. VIEWBAG, MODEL ViewBag/ViewData và Model được sử dụng để chia sẻ dữ liệu giữa Controller và View
  • 32. 32 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 5. VIEWBAG, MODEL ViewBag/ViewData Đã được sử dụng để truyền dữ liệu từ Controller sang View. View sẽ sử dụng để xây dựng giao diện phù hợp trả lại cho người dùng.
  • 33. 33 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 5. VIEWBAG, MODEL Model
  • 34. 34 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 5. VIEWBAG, MODEL Khai báo kiểu dữ liệu của Model Chú ý: phân biệt @model và @Model  @model: Dùng để khai báo kiểu của @Model  @Model: Đối tượng chứa dữ liệu truyền từ Controller
  • 35. 35 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 5. VIEWBAG, MODEL Chia sẽ với Model
  • 36. 36 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 5. VIEWBAG, MODEL Minh họa: ProductList
  • 37. 37 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 5. VIEWBAG, MODEL Minh họa: ProductDetail
  • 38. 38 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 6. CHIA SẺ DỮ LIỆU THEO PHIÊN - SESSION  Phiên làm việc (session) được tính từ lúc bắt đầu truy cập website cho đến khi đóng cửa sổ trình duyệt hoặc hết hạn sử dụng.  Dữ liệu được lưu vào session sẽ được duy trì trong suốt phiên làm việc và được truy cập bởi bất kz thành phần nào hoạt động trong phiển làm việc đó.
  • 39. 39 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 6. CHIA SẺ DỮ LIỆU THEO PHIÊN - SESSION Ứng dụng:  Duy trì giỏ hàng: giỏ hàng cần duy trì trong suốt quá trình tìm kiếm và chọn mua hàng hóa.  Duy trì tài khoản đăng nhập: tài khoản đăng nhập cần được duy trì trong suốt phiên làm việc để khi cần có thể sử dụng. Mã lấy đối tƣợng session:
  • 40. 40 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 6. CHIA SẺ DỮ LIỆU THEO PHIÊN - SESSION Thao tác Session:
  • 41. 41 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 6. CHIA SẺ DỮ LIỆU THEO PHIÊN - SESSION Minh họa:  Shopping Cart: duy trì danh sách hàng đã chọn trong session  CRUD: duy trì dữ liệu trong List
  • 42. 42 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 7. APPLICATION
  • 43. 43 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 7. APPLICATION Application Scope
  • 44. 44 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 7. APPLICATION Minh họa:  Bộ đến khách thăm web  Chat  Queue mails
  • 45. 45 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 8. COOKIE  Cookie là mẫu tin nhỏ được lưu trên máy client và truyền thông với server trong các request vàresponse.  Ứng dụng: Chia sẻ dữ liệu giữa các trang trong website được truy cập từ máy  Tài khoản đăng nhập  Hàng hóa đã xem
  • 46. 46 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 8. COOKIE
  • 47. 47 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 8. COOKIE Cookie API
  • 48. 48 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 8. COOKIE Minh họa: Duy trì hàng hóa đã xem
  • 49. 49 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net 9. GLOBAL.ASAX
  • 50. 50 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net Minh họa: HitCounter 9. GLOBAL.ASAX
  • 51. 51 HẾT CHƢƠNG 6 © Dương Thành Phết phetcm@gmail.com - www.thayphet.net