BÀI GIẢNG LAB - TẠO TRANG LỌC CÁC THỂ LOẠI SẢN PHẨM

Chia sẻ: Lưu Trần Quang Trung | Ngày: | Loại File: PDF | Số trang:0

Thêm vào BST

Báo xấu

89
lượt xem 22
download

Download Vui lòng tải xuống để xem tài liệu đầy đủ

TÀI LIỆU THAM KHẢO - BÀI GIẢNG LAB - TẠO TRANG LỌC CÁC THỂ LOẠI SẢN PHẨM

Chủ đề:

Bình luận(0) Đăng nhập để gửi bình luận!

Lưu

Nội dung Text: BÀI GIẢNG LAB - TẠO TRANG LỌC CÁC THỂ LOẠI SẢN PHẨM

Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn LAB – TẠO TRANG LỌC CÁC THỂ LOẠI SẢN PHẨM Mục đích thiết kế trang này là khi khách hàng click vào một thể loại sản phẩm nào đó trên menu thì chúng ta sẽ hiện ra các sản phẩm thuộc thể loại hàng này. N YÊ U H C ỆT VI Lớp: Web Doanh nghiệp nâng cao Trang 1 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn + Mở trang inc_category.php để thiết kế N YÊ + Trong trang này hãy tạo một Recordset rs_Items ở chế độ QuB để lọc ra các sản phẩm thuộc một thể lọai sản phẩm khi người dùng click vào như sau: U H C ỆT VI Lớp: Web Doanh nghiệp nâng cao Trang 2 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn + Trong chế độ Recordset nâng cao Advance hãy chỉnh giá trị mặc định cho KTColParam1 đúng với giá trị mà bạn đã chỉ ra trong QuB N YÊ U H C ỆT + Sau khi tạo Recordset xong trong Tab Bindings sẽ xuất hiện Recordset sau: VI Lớp: Web Doanh nghiệp nâng cao Trang 3 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn + Hãy chèn các trường trong Recordset ra giao diện để có được như sau: N YÊ + File -> Save -> F12 + Kết quả sẽ như sau: U H C ỆT VI + Hãy tạo vùng lặp lại để xuất ra 10 sản phẩm của một thể lọai sản phản phẩm nào đó khi người dùng click vào menu + Chọn Table đang chứa các trường của sản phẩm (trong dòng số 2 này có chèn một Table 1 dòng 1 cột) Lớp: Web Doanh nghiệp nâng cao Trang 4 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn N + Thực hiện Looper Wizard YÊ U H + Đặt các thông số cho lệnh như sau: C ỆT VI Lớp: Web Doanh nghiệp nâng cao Trang 5 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn + Click OK + Hãy định các thuộc tính cho bảng như sau: N YÊ U H + File -> Save -> F12 C ỆT VI Lớp: Web Doanh nghiệp nâng cao Trang 6 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn + Hãy chèn các lệnh phân trang Pages List Limited, Next X Pages, Previous X Pages để cho người dùng có thể xem tiếp các sản phẩm (xin vui lòng xem lại các bài LAB trước về cách sử dụng lệnh này) như sau: N YÊ + Ta có thể chèn thêm thanh trạng thái Recordset để cho người dùng biết trong lọai sản phẩm này U chúng ta có tất cả là bao nhiêu sản phẩm H C ỆT VI + Kết quả sẽ như sau: Lớp: Web Doanh nghiệp nâng cao Trang 7 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn N + File -> Save -> F12 YÊ U H C ỆT VI + Trong vùng lặp lại hãy chèn thêm một dòng trống như sau: Lớp: Web Doanh nghiệp nâng cao Trang 8 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn N YÊ U + Đặt con trỏ trong dòng này thực hiện lệnh sau: H C ỆT + Trong Tab General cấu hình các thông số như sau: VI + Trong Tab Bindings hãy chọn các cột tương ứng , tại Default Value click nút sấm chớp để Bind vào các trường tương ứng trong Recordset rs_Items Lớp: Web Doanh nghiệp nâng cao Trang 9 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn N YÊ U H C + Hãy Bind để có được kết quả sau: ỆT VI Lớp: Web Doanh nghiệp nâng cao Trang 10 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn + Chọn Tab Button cấu hình như sau: N YÊ U + Click nút OK bạn sẽ thấy xuất hiện lệnh như sau: H C ỆT VI + Kết quả giao diện sẽ như sau: Lớp: Web Doanh nghiệp nâng cao Trang 11 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn N YÊ + File -> Save -> F12 để chạy thử U H C ỆT VI + Ta sẽ sửa lại giao diện và vị trí cho nút Add to cart như sau Lớp: Web Doanh nghiệp nâng cao Trang 12 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn + Trước dòng chứa nút Add to cart hãy chèn thêm một dòng vào, sau đó trong dòng này chèn thêm một bảng có 2 cột như sau: N YÊ U H + Hãy di chuyển trường ẩn và Text Filed vào Cell đầu và nút Add to cart vào Cell sau của dòng mới chèn vào như sau: C ỆT VI + Hãy chuyển qua chế độ Code di chuyển thẻ Form sao cho nằm trước Cell chứa trường ẩn và thẻ nằm sau Cell chứa nút Add to Cart như sau: Lớp: Web Doanh nghiệp nâng cao Trang 13 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn N + Trong thẻ input có thuộc tính SRC chỉ đường dẫn tới hình nút Add to cart chúng ta hãy thay thế YÊ hình nút này tùy ý như sau: U H C + Chuyển qua chế độ Design bây giờ giao diện sẽ như sau: ỆT VI + File -> Save -> F12 + Kết quả cuối cùng sẽ như sau: Lớp: Web Doanh nghiệp nâng cao Trang 14 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn N YÊ U H C ỆT VI + Bạn có thể sử dụng thêm các lệnh Show If Recordset is Empty và Show If Recordset is Not Empty để dấu các vùng dữ liệu (xen vui lòng xem lại các bài LAB trước để biết cách sử dụng các lệnh này) Lớp: Web Doanh nghiệp nâng cao Trang 15 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn + Hãy tạo link cho tên sản phẩm và hình sản phẩn tới trang hiện chi tiết sản phẩm như sau: + Chọn {rs_Items.ItemName} , click nút Browse for file trong hộp Link , chọn link tới trang index.php và truyền các tham số sau: N YÊ + Click nút OK + Bước kế tiếp hãy tạo chức năng phóng to hình khi click vào hình sản phẩm: + Hãy sử dụng đọan Code sau đặt trước thẻ U
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn } .highslide-loading { display: block; color: black; font-size: 8pt; font-family: sans-serif; font-weight: bold; text-decoration: none; padding: 2px; border: 1px solid black; background-color: white; padding-left: 22px; background-image: url(graphics/loader.white.gif); N background-repeat: no-repeat; background-position: 3px 1px; YÊ } a.highslide-credits, a.highslide-credits i { padding: 2px; color: silver; U text-decoration: none; font-size: 10px; H } a.highslide-credits:hover, a.highslide-credits:hover i { C color: white; background-color: pupple; } ỆT a.highslide-full-expand { background: url(graphics/fullexpand.gif) no-repeat; display: block; VI margin: 0 10px 10px 0; width: 34px; height: 34px; } /* These must always be last */ .highslide-display-block { display: block; } .highslide-display-none { display: none; } --> + Chọn hình sản phẩm , chuyển sang chế độ Code chèn thêm đọan code sau: Lớp: Web Doanh nghiệp nâng cao Trang 17 Biên soạn: Nguyễn Phát Tài
Trung Tâm Đào Tạo Công Nghệ Mạng VIỆT CHUYÊN 740/12 Sư Vạn Hạnh (nối dài), P12, Q10, TP.HCM Tel: (84.8) 862 7509 – (84.8) 2649179 Email: traning@vietchuyen.org Website: www.vietchuyen.org – www.ddcntt.vn