(NB) Giáo trình Thiết kế web dùng đào tạo kỹ năng cơ bản về thiết kế và lập trình web, cho trình độ cao đẳng nghề quản trị mạng máy tính. Mời các bạn cùng tham khảo để nắm chi tiết nội dung giáo trình!
BỘ LAO ĐỘNG -THƯƠNG BINH VÀ XÃ HỘI TRƯỜNG CAO ĐẲNG NGHỀ KỸ THUẬT CÔNG NGHỆ -š› & š› - GIÁO TRÌNH MƠ ĐUN: THIẾT KẾ WEB NGHỀ: QUẢN TRỊ MẠNG MÁY TÍNH TRÌNH ĐỘ: CAO ĐẲNG Ban hành kèm theo Quyết định số: 248b/QĐ-CĐNKTCN ngày 17 tháng năm 2019 Hiệu trưởng Trường Cao đẳng nghề Kỹ thuật Công nghệ Hà Nội, năm 2021 (Lưu hành nội bộ) TUYÊN BỐ BẢN QUYỀN Tài liệu thuộc loại sách giáo trình nên nguồn thơng tin phép dùng ngun trích dùng cho mục đích đào tạo tham khảo Mọi mục đích khác mang tính lệch lạc sử dụng với mục đích kinh doanh thiếu lành mạnh bị nghiêm cấm MÃ TÀI LIỆU: MĐQTM23 LỜI GIỚI THIỆU Chương trình khung quốc gia nghề Quản trị mạng máy tính xây dựng sở phân tích nghề, phần kỹ thuật nghề kết cấu theo môđun, môn học Để tạo điều kiện thuận lợi cho sở dạy nghề trình thực hiện, việc biên soạn giáo trình kỹ thuật nghề theo môđun, môn học đào tạo nghề cấp thiết Mô đun MĐQTM23: Thiết kế web mô đun đào tạo nghề biên soạn theo hình thức tích hợp lý thuyết thực hành Trong q trình thực hiện, nhóm biên soạn tham khảo nhiều tài liệu thiết kế lập trình web ngồi nước, kết hợp với kinh nghiệm thực tế sản xuất Mặc dầu có nhiều cố gắng, khơng tránh khỏi khiếm khuyết, mong nhận đóng góp ý kiến độc giả để giáo trình hoàn thiện Xin chân thành cảm ơn! Hà Nội, ngày 25 tháng 04 năm 2021 Tham gia biên soạn Chủ biên : Phùng Quốc Cảnh Tập thể Giảng viên khoa CNTT Mọi thơng tin đóng góp chia sẻ xin gửi hòm thư: canhdhtn86@gmail.com, liên hệ số điện thoại: 0359300585 MỤC LỤC BÀI 1: TỔNG QUAN VỀ WWW – NGÔN NGỮ HTML Lịch sử World Wide Web (www) 1.1 Giới thiệu World Wide Web (www) 1.2 Giới thiệu URL: 1.3 Giới thiệu HTTP Nhập môn ngôn ngữ HTML (Hyper Text Markup Language) Trang văn trang Ngôn ngữ đặc tả Script 4.1 Khai báo biến: 4.2 Toán tử: 4.3 Các cấu trúc điều kiện 10 4.4 Các cấu trúc lặp 10 4.5 Khai báo hàm thủ tục: 11 4.6 Một số hàm thông dụng ASP: 11 CSS (Cascading Style Sheets) 12 5.1 Cú pháp CSS 12 5.2 Các thuộc tính CSS 12 5.3 Sử dụng CSS trang HTML 13 BÀI 2: THIẾT KẾ WEB TĨNH 15 Tổng quan: 15 Trang văn trang 15 2.1 Tạo tiêu đề 15 2.2 Một số thẻ trình bày định dạng văn bản: 16 2.3 Các thuộc tính thẻ trình bày trang 16 Bảng biểu (Table) trang khung (Frame) 17 3.1 Bảng biểu 17 3.2 Khung – Frames 18 Multimedia trang Web 21 4.1 Đặt màu 21 4.2 Màu chữ văn 22 4.3 Màu đầu mối liên kết - Thuộc tính LINK, VLINK ALINK 22 4.4 Thuộc tính mã màu 22 4.5 Nạp hình ảnh làm cho trang văn 22 4.6 Chèn ảnh - thẻ 22 Các yếu tố động trang 24 5.1 Đưa âm vào tài liệu 24 5.2 Đưa Video vào tài liệu 24 Khung nhập (Form) 25 6.1 Form 25 6.2 Các thành phần FORM 26 Liên kết – Link 30 7.1 Thẻ neo mối liên kết 30 7.2 Thuộc tính HREF 30 7.3 Liên kết – External Links 30 7.4 Địa tuyệt đối 30 7.5 Địa tương đối 30 7.6 Liên kết nội – Internal Link 30 7.7 Siêu liên kết – Hyperlink 31 BÀI 3: XÂY DỰNG WEB ĐỘNG 34 1.Tổng quan ASP.Net ADO.Net: 34 1.1 Tổng quan ngôn ngữ ASP.Net: 34 1.2 Mơ hình ADO.Net 42 Các đối tượng ASP.Net: 43 2.1 ASP.Net Web Server Controls: 43 2.2 Các đối tượng ASP.NET 49 2.3 Biến cấu trúc điều khiển: 55 2.4 Thủ tục hàm 61 Các đối tượng ADO.Net: 62 3.1 Các đối tượng ADO.Net 62 3.2 Các lớp SqlClient mơ hình ADO.Net 63 3.3 Các điều khiển liệu ASP.Net 76 TÀI LIỆU THAM KHẢO 110 GIÁO TRÌNH MƠ ĐUN Tên mô đun: Thiết kế web Mã số mô đun: MĐQTM23 Vị trí, tính chất, ý nghĩa vai trị mơ đun: - Vị trí: Mơ đun Thiết kế web bố trí sau học xong mơn học Hệ quản trị Cơ sở liệu, Cơ sở liệu, Lập trình trực quan - Tính chất: mô đun đào tạo nghề - Ý nghĩa vai trò: dùng đào tạo kỹ thiết kế lập trình web, cho trình độ cao đẳng nghề quản trị mạng máy tính Mục tiêu mơ đun: - Về kiến thức: + Định hướng kết cách thiết kế Web site + Có khả sử dụng thẻ HTML + Biết cách tổ chức thông tin trang chủ - Về kỹ năng: + Thiết kế giao diện + Lập trình website + Sử dụng thành thạo công cụ thiết kế Web + Xây dựng ứng dụng web động + Cài đặt, cấu hình dịch vụ IIS - Về lực tự chủ trách nhiệm: + Có khả kết hợp với sở liệu để tạo trang Web động + Bố trí học tập làm việc khoa học Nội dung mô đun: Thời gian Số Tên mô đun Tổng Lý Thực Kiểm TT số thuyết hành tra* Tổng quan www – ngôn ngữ 2 HTML Thiết kế web tĩnh 23 16 Thiết kế web động 35 27 Cộng 60 15 43 BÀI 1: TỔNG QUAN VỀ WWW – NGÔN NGỮ HTML Mã bài: MĐQTM23-01 Giới thiệu: Bài học nhằm giới thiệu sơ lược lịch sử World Wide Web (www), URL, giao thức HTTP ngôn ngữ phổ biến dùng World Wide Web HTML (Hyper Text Markup Language) Mục tiêu: - Trình bày lịch sử WWW; - Trình bày cấu trúc trang HTML thẻ HTML bản, cách bố trí, xử lý ứng dụng file CSS; - Thực thiết kế giao diện; - Biết cách tổ chức thông tin trang chủ bố trí văn trang - Ghi nhớ lệnh điều khiển ngôn ngữ đặc tả Script - Thực thao tác an toàn với máy tính Nội dung chính: Lịch sử World Wide Web (www) Mục tiêu: Trình bày lịch sử WWW 1.1 Giới thiệu World Wide Web (www) Ngày người ta dùng máy tính cơng cụ hữu ích để truy cập Internet, chủ yếu tìm kiếm thơng tin Thơng tin văn bản, hình ảnh, âm hay thơng tin đa phương tiện… Nhu cầu tìm kiếm thơng tin ngày nhiều đưa vấn đề: làm dễ dàng sử dụng máy tính truy cập Internet công cụ phục vụ đắc lực cho việc tra cứu, tìm kiếm thơng tin mạng thơng tin rộng lớn toàn cục Vấn đề trở nên dễ dàng ý tưởng siêu văn (Hypertext) – văn thông minh nhà tin học Ted Nelson đề xuất vào năm 1965 Đến 1989, dự án thức thực kỹ sư trẻ người Anh tên Tim Berners – Lee World Wide Web (www) mạng tài nguyên thông tin WWW dựa chế để tài nguyên trở nên sẵn dùng cho người xem rộng rãi tốt, là: - Cơ chế đặt tên dạng việc định dạng tài nguyên WWW (như URL) - Các giao thức, để truy cập tới tài nguyên qua WWW (như HTTP) - Siêu văn bản, để dễ dàng chuyển đổi tài nguyên (như HTML) 1.2 Giới thiệu URL: Mọi tài nguyên sẵn dùng WWW – tài liệu HTML, ảnh, video clip, chương trình v v - có địa mà mã hóa URL URL xem trỏ dùng với mục đích đơn giản xác định vị trí tài nguyên môi trường Internet Thông qua URL mà Web Browser tham chiếu đến Web Server dịch vụ khác Internet ngược lại Các URL thường gồm phần: - Việc đặt tên chế dùng để truy cập tài nguyên - Tên máy tính lưu trữ (tổ chức) tài nguyên - Tên thân tài nguyên, đường dẫn Ví dụ: URL xác định trang W3C Technical Reports http://www.w3.org/TR URL đọc sau: Có tài liệu sẵn dùng theo giao thức HTTP, lưu máy www.w3.org, truy cập theo đường dẫn “/TR” Các chế khác ta thấy tài liệu HTML bao gồm “mailto” thư điện tử “ftp” FTP Ví dụ sau tới hộp thư (mailbox) người dùng: Mọi góp ý, xin gửi thư tới Joe Cool Các định danh đoạn (fragment identifiers): Một số URL tới việc định vị tài nguyên Kiểu URL kết thúc với “#” theo sau dấu hiệu kết nối (gọi định danh đoạn) Ví dụ, URL đánh dấu móc tên section_2: http://somesite.com/html/top.html#section_2 Các URL tương đối: khơng theo chế đặt tên Đường dẫn thường tham chiếu tới tài nguyên máy chứa tài liệu Các URL tương đối gồm thành phần đường dẫn tương đối (như “ ” nghĩa mức cấu trúc định nghĩa đường dẫn), bao gồm dấu hiệu đoạn Ví dụ giải pháp URL tương đối, giả sử có URL gốc: “http://www.acme.com/support/intro.html” URL tương đối đánh dấu cho liên kết siêu văn bản: Suppliers mở rộng thành URL đầy đủ “http://www.acme.com/support/suppliers.html” URL tương đối việc đánh dấu cho ảnh mở rộng thành URL đầy đủ “http://www.acme.com/icons/logo.gif” Các URL dùng để: - Liên kết tới tài liệu tài nguyên khác - Liên kết tới kiểu dạng bên kịch (script) 1.3 Giới thiệu HTTP Web Browser Web Server giao tiếp với thông qua giao thức gọi HTTP Sự kết nối HTTP qua giai đoạn: Hình 1.1: Sự kết nối HTTP - Tạo kết nối: Web Browser giao tiếp với Web Server nhờ địa URL - Internet số cổng (ngầm định 80) đặc tả URL - Thực yêu cầu: Web Browser gửi thông tin tới Web Server để yêu cầu phục vụ Việc gửi thông tin gửi phương thức GET dùng cho việc lấy đối tượng từ Server, hay POST dùng cho việc gửi liệu tới đối tượng Server - Phản hồi: Web Server gửi phản hồi Web Browser nhằm đáp ứng yêu cầu Web Browser - Kết thúc kết nối: Khi kết thúc trình trao đổi Web Browser Web Server kết nối chấm dứt Và mối liên hệ Client Server tồn trình trao đổi với nhau, điều có lợi điểm lớn giảm lưu thông mạng Nhập môn ngơn ngữ HTML (Hyper Text Markup Language) Mục tiêu: Trình bày cấu trúc trang HTML thẻ HTML Ngôn ngữ phổ biến dùng World Wide Web HTML (Hyper Text Markup Language) Nó dùng cho mục đích sau: - Phổ biến tài liệu trực tuyến với heading, văn bản, bảng, danh sách, ảnh, v.v… - Truy tìm thơng tin trực tuyến theo liên kết siêu văn việc kích vào nút - Thiết kế định dạng cho việc kiểm soát giao dịch (transaction) với thiết bị từ xa, người dùng việc tìm kiếm thơng tin, tạo sản phẩm, đặt hàng,.v.v… - Bao gồm spread-sheets, video clips, sound clips, ứng dụng trực tiếp khác tài liệu họ HTML đánh dấu văn dạng thẻ (Tag) Cấu trúc thẻ HTML có dạng sau: - Thẻ đóng: văn chịu tác động Trong đó: + : bắt đầu hiệu ứng thẻ + : kết thúc hiệu ứng thẻ Ví dụ: văn in đậm cho kết trình duyệt là: văn in đậm - Thẻ mở: văn chịu tác động Ví dụ: Đoạn 1Đoạn cho kết là: Đoạn Đoạn - Về quy tắc thẻ lồng lẫn phải đảm bảo cú pháp thẻ Trang văn trang Mục tiêu: Biết cách tổ chức thông tin trang chủ bố trí văn trang; Thực thiết kế giao diện Trang web có hai đặc trưng bản: - Siêu văn (hypertext): bao gồm văn bản, hình ảnh tĩnh, hình ảnh động, âm thanh, màu sắc thành phần khác - Siêu liên kết (hyperlink): có nhiều mối liên kết đa dạng với trang thành phần khác website phạm vi toàn cầu Website tập hợp nhiều webpage có chủ đề địa định Trong website, người ta “đi lại” webpage đường hyperlink Các loại trang chủ yếu website: - Trang chủ, trang gốc (Master page): với website có trang chủ Là nơi thể rõ chủ đề site thông qua cách bố trí danh mục tin, cách trang trí mỹ thuật bật… - Trang nội dung (content page): trang chứa nội dung mục tin Ngoài trang có danh mục tin theo chủ đề mục tin cha, link để liên kết tới trang khác - Trang đầu (home page, start page): trang xuất sau khởi động trình duyệt Có thể trang chủ khơng trang đặc biệt - Trang đặc biệt (special page): trang xuất trang đầu khởi động trình duyệt web Trang có khơng, có thời gian tồn ngắn với nội dung thông báo, đưa tin đặc biệt, muốn người quan tâm trước tiên Một trang web thường gồm vài trang hình Ngơn ngữ đặc tả Script Mục tiêu: Ghi nhớ lệnh điều khiển ngôn ngữ đặc tả Script Script hay kịch bản, theo thuật ngữ lập trình, chương trình chạy với chế độ thông dịch máy khách (client) hay máy chủ (server) nhằm tạo ứng dụng web (web base application) Xét phương diện: - Client-side : script bổ sung vào trang web cho phép tạo trang web tương tác, có hiệu ứng động dựa vào mơ hình đối tượng trình duyệt (BOM: browser object model) - Server-side: sử dụng đối tượng liên quan để chạy script server Có nhiều loại ngôn ngữ đặc tả JavaScript, VBScript, Jscript, , tài liệu giới thiệu sơ lược ngôn ngữ đặc tả VBScript nhằm giúp học viên tham khảo thêm thực lập trình chức cho web 4.1 Khai báo biến: VB Script khai báo biến thơng qua từ khóa dim, biến VBScript khơng cần xác định kiểu, biến không cấu trúc xem biến vơ hướng, chứa tự chuyển đổi hầu hết kiểu liệu Hằng khai báo từ khóa Const Ví dụ: Const p = 3.14 Mảng định nghĩa truy xuất thông qua số - Dim x,y,z - Dim a(10) ‘Khai báo mảng chiều a có 10 phần tử’ - Dim b(5,10) ‘Khai báo mảng hai chiều b’ - Redim a(20) ‘Khai báo lại mảng a tăng thêm 10 phần tử giữ lại giá trị 10 phần tử đầu’ 4.2 Toán tử: VBScript cho phép sử dụng toán tử xử lý chuỗi, so sánh phép gán, tính tốn số học sau: Tốn tử Tên gọi Ví dụ ^ Mũ 2^3 = + Cộng x+y trừ * Nhân / Chia \ Chia phần nguyên 7\3 (kết quả: 2) Mod Chia lấy dư mod (kết quả: 1) & + Cộng chuỗi “he” & “llo” (kết quả: “hello”) = > lớn < nhỏ Hình 3.25.Cửa sổ Command and Paramater Editer c) Xóa ghi Các kỹ thuật thực xóa ghi tương tự Update ghi Tương tự điều khiển data source ta thực khai báo: Khai báo hai thuộc tính DeleteCommand DeleteCommandType DeleteCommand="DELETE FROM Products WHERE (ProductID = @ProductID)" Khai báo tham số Ví dụ 3.14 Thực xóa liệu từ điều khiển Grid View (vidu3_15.aspx) 96 d) Chèn ghi Để chèn ghi ta sử dụng kỹ thuật tương tự thông qua khai báo: Khai báo hai thuộc tính InsertCommand InsertCommandType InsertCommand="INSERT INTO Products(ProductID, ProductType, ProductName, ProductDescription, ProductSize, ProductImageURL, UnitPrice) VALUES (@ProductID, @ProductType, @ProductName, @ProductDescription, @ProductSize, @ProductImageURL, @UnitPrice)"> Khai báo tham số Ví dụ 3.15 Trong ví dụ dùng GridView để hiển thị thực thao tác Update, Delete; sử dụng DetailView để hiển thị chi tiết ghi chọn GridView đồng thời cho phép cập nhật liệu(vidu3_16.aspx) Kết cho hình 3.26 Hình 3.26 Duyệt ví dụ 3.15 Chú ý: - Để Upload file lên Server ta dùng điều khiển FileUpload - Để tạo Download file mở sử dụng thẻ Hyperlink , địa URL phải bao gồm server path file name bao gồm tên mở rộng 98 Download Baigiang Web Mở file ảnh e) Lọc liệu sử dụng Data Source controls Data source controls cung cấp số dịch vụ liệu để dễ dàng có thêm khả tiên tiến cho ứng dụng Nó bao gồm việc lọc liệu dựa điều kiện tìm kiếm mà ta định Việc lọc liệu thuận lợi làm việc với cached data, ta cung cấp khả tìm kiếm khơng cần phải chạy lại truy vấn gọi lại phương thức đọc liệu Để lọc liệu, data source control phải cấu sau: + Đối với điều khiển SqlDataSource AccessDataSource, thuộc tính DataSourceMode phải thiết lập tới DataSet + Đối với điều khiển ObjectDataSource, đối tượng source object phải trả DataSet DataTable Thiết lập biểu thức lọc (Filter Expression): Ta định lọc áp dụng cho liệu trả điều khiển ObjectDataSource, SqlDataSource, AccessDataSource việc thiết lập thuộc tính FilterExpression data source Biểu thức lọc áp dụng phương thức select data source control gọi Cú pháp biểu thức lọc phụ thuộc vào cú pháp thuộc tính Expression lớp DataColumn FilterExpression="Country LIKE '{0}' AND LastName LIKE '{1}'" Chú ý: Cả hai ký tự % * sử dụng làm ký tự thay toán tử so sánh LIKE Ký tự thay cho phép vị trí bắt đầu kết thúc mẫu Ví dụ: "ItemNa L '*product*'" me IKE "ItemNa L '*product'" me IKE "ItemNa L 'product*'" me IKE Ký tự thay khơng phép nằm chuỗi mẫu Ví dụ, 'te*xt'không phép Cung cấp tham số lọc (Filter Parameters): Ta cung cấp tham số biểu thức lọc cho điều khiển ObjectDataSource, SqlDataSource, AccessDataSource Các tham số cho phép ta cung cấp giá trị lọc thời điểm chạy không cần viết code để thiết lập thuộc tính FilterExpression Ta định tham số biểu thức lọc sử dụng collection FilterParameters điều khiển data source Các tham số truy xuất liệu từ điều khiển, đối tượng QueryString, session state, user profile,.v.v… Trong biểu thức lọc (Filter Expression), ta tạo placeholders tương ứng tới items collection FilterParameters điều khiển data source Các Placeholders số hóa, với thể tham số collection Ta 99 định placeholder biểu thức lọc cách thay số tham số lọc ký tự '{' '}' ví dụ sau: Country = '{0}' AND LastName LIKE '{1}' 100 Bài tập thực hành học sinh, sinh viên: Bài tập 3.1: Câu 1: Trình bày khác ASP.NET Server Control phần từ HTML Câu 2: Validation control gì? Trình bày mục đích sử dụng validation control thiết kế web động Câu 3: Giải thích ý nghĩa thuật ngữ dùng validation controls sau: RequiredFieldValidator, CompareValidator, RangeValidator, RegularExpressionValidator, ValidationSummary Câu 4: Tạo Web Form đăng ký thông tin tuyển dụng Mục tiêu: Giúp sinh viên biết cách vận dụng ASP.NET Server Control Web HTML Server Control xây dựng trang web Hướng dẫn: - Sinh viên viết ngơn ngữ C# VB.NET - Trong phần tập sinh viên tạo ASP.NET Web Form có tên JobRegister.aspx Form chứa server control dạng Web Control HTML Server control Form cho phép user nhập thông tin cá nhân kỹ chuyên môn - Giao diện Form minh họa hình bên dưới: - Sau hồn tất việc đăng ký thông tin hiển thị đầy đủ trangASP.NET khác RegisteringComplete.aspx 101 Câu 5: Sử dụng Validation Control để thiết kế trang web: - Kiểm tra thông tin đầu vào cho trang đăng nhập - Thanh toán hoá đơn, form điền thông tin sử dụng kiểm tra thông tin người dùng nhập liệu Mục tiêu: Giúp sinh viên áp dụng điều khiển RequiredFieldValidator, CompareValidator, RangeValidator, RegularExpressionValidator, ValidationSummary… để tạo ràng buộc liệu cho trang web Hướng dẫn: Tạo ứng dụng web ASP.NET Thêm trang vào dự án Đặt tên Dangnhap.aspx Thiết kế form đăng nhập (theo gợi ý mẫu đây: người dung kích chuột vào button Login chuyển sang trang Thanhtoanhoadon.aspx, kích chuột vào button Reset xố trắng liệu textbox 102 Bấm chuột phải lên dự án thêm WebForm đặt tên Thanhtoanhoadon.aspx Thiết kế form với ràng buột liệu cho trường textbox với giao diện minh hoạ hình đây: Khi người dùng kích chuột vào button Submit chuyển sang trang Camon.aspx sau: Bài tập 3.2 Câu 1: Trình bày chức đối tượng Application ASP.NET? 103 Câu 2: Đối tượng Session gì? Trình bày chức đối tượng Session ứng dụng web? Câu 3: Đối tượng Request gì? Trình bày chức đối tượng Request ứng dụng web? Câu 4: Sử dụng đối tượng Response & Request Asp.Net để thực trang web cho phép nhập hai số a,b Sau tính cộng, trừ nhân chia hai số cho Hướng dẫn: - Bước 1: Thiết kế giao diện trang nhập liệu - Bước 2: Viết mã lệnh + Lấy giá trị số a & b sử dụng phương thức Request.Form["Tên Điều Khiển"] + Tính tổng, hiệu, tích, thương a&b + Hiển thị kết Câu 5: Sử dụng đối tượng Application để tính số lần truy cập vào trang web Câu 6: Cho đoạn chương trình sau, thực thi kết giải thích ý nghĩa chương trình Private Sub Page_Load(sender As Object, e As System.EventArgs) Session.Timeout = 50 Session.Contents("Counter") = _ Session.Contents("Counter") + 10 Response.Write("Khoi tao Session ASPX ") Response.Write("Counter: " & _ Session.Contents("Counter")) Session.Contents.Remove("Countner") Session.Remove("Countner") Session.RemoveAll() End sub Untitled Page Bài tập 3.3 Câu 1: Trình bày cú pháp cấu trúc rẽ nhánh If…then, Select Case Asp.Net? Câu 2: Trình bày cú pháp lặp Do…Loop Asp.Net? Câu 3: Trình bày cú pháp cấu trúc lặp For Each …Next For …Next? Câu 4: Viết chương trình cho phép người dùng nhập vào tháng bất kỳ, in tháng thuộc mùa năm Hướng dẫn: Sử dụng cấu trúc Select Case Câu 5: Giải thích ý nghĩa đoạn chương trình sau: 104 Private Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Dim MyCookie As New HttpCookie("LastVisit") Dim MyCookie1 As New HttpCookie("New") Dim now As DateTime = DateTime.Now ' Ghi giá trị xuống Cookies Response.Cookies.Clear() MyCookie.Value = now.ToString() MyCookie.Expires = now.AddHours(1) Response.Cookies.Add(MyCookie) MyCookie1.Value = now.ToString() MyCookie1.Expires =now.AddHours(1) Response.Cookies.Add(MyCookie1) Response.Write("Number cookie:" & Request.Cookies.Count & "") ' Đọc cookie For Each strKey As String In Request.Cookies Response.Write(strKey & " = " & _ Request.Cookies(strKey).Value & "") Next End Sub Bài tập 3.4 Câu 1: Trình bày thủ tục cách khai báo thủ tục Asp.Net? Câu 2: Trình bày hàm cách khai báo hàm Asp.Net? Câu 3: Phân biệt tham biến tham trị Asp.Net? Câu 4: Viết thủ tục tính tổng hai số a,b Xây dựng trang web sử dụng thủ tục vừa tạo Hướng dẫn: Bước 1: Viết thủ tục tính tổng hai số, khai báo sau Sub Tong(ByVal a As Integer, ByVal b As Integer) Bước 2: Xây dựng trang web có sử dụng thủ tục vừa tạo Giao diện Mã nguồn tham khảo: Untitled Page 105 Giá trị a: Giá trị b: Câu 5: Xây dựng lại chương trình thay thủ tục hàm Câu 6: Giải thích ý nghĩa hai tham số a,b chương trình sau, cho biết kết trả chương trình Partial Class vidu2_20 Inherits System.Web.UI.Page 'Khai báo a tham trị b tham biến Function Tong(ByVal a As Integer, ByRef b As Integer) As Integer a += 100 b -= 10 Return (a + b) End Function Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load Dim a, b As Integer a = 100 b = 100 Response.Write("Gia trị trước truyền vào cho hàm ") Response.Write("a=" & a.ToString & "") Response.Write("b=" & b.ToString & "") Response.Write("Gọi hàm tong(a,b):" & Tong(a, b).ToString & "") Response.Write("Gia trị sau truyền vào cho hàm ") Response.Write("a=" & a.ToString & "") Response.Write("b=" & b.ToString & "") End Sub End Class 106 Bài tập 3.5 Câu Thực hành lại ví dụ chương để ơn lại nội dung vừa học Câu Thiết kế giao diện trang EditorData.aspx sau: Giao diện thiết kế Giao diện thực thi Gợi ý: - Thiết kế giao diện theo mẫu - Cấu hình SqlDataSource với database mặc định Northwind (hoặc sử dụng database người dùng) - Khi người dùng chọn ProductName DropdownList, nội dung DetailView cập nhật Câu 3: Xây dựng ứng dụng web gồm trang asp.net sau: Dangnhap.aspx, DanhsachLoaimathang.aspx, Capnhatloaimathang.aspx Các trang web có cấu trúc sau: - Giao diện thiết kế: Giao diện trang Dangnhap.aspx 107 Giao diện trang CapnhatLoaimathang.aspx - Cấu hình phần ……… tập tin web.config sau:Trong đó: + loginUrl: rõ trang người dùng đăng nhập + defaultUrl: rõ trang chuyển đến đăng nhập thành công + name: rõ tên Cookie tạo + Timeout: thời gian cookie tồn (tính phút) + passwordFormat: khơng mã hóa mật Trong ví dụ ta khai báo người dung “tom” “jerry” Lưu ý: lưu user vào sở liệu để kiểm tra đăng nhập - Viết kiện xử lý cho trang + Khi người dùng truy cập vào trang CapnhatLoaimathang.aspx mà chưa đăng nhập tự động chuyển qua trang Dangnhap.aspx 108 + Nhập vào tên đăng nhập “tom”, mật “tom”, nhấn nút Đăng nhập để vào trang CapnhatLoiamathang.aspx Nếu người dung chọn Nhớ thơng tin sau 30 phút sau khơng cần đăng nhập truy cập + Sau người dùng cập nhật xong thông tin, chọn Đăng xuất để trang Dangnhap.aspx, thông tin session hay cookie hủy để kết thúc phiên làm việc 109 TÀI LIỆU THAM KHẢO [1] Jason Butler and Tony, “ASP - Database”, Nhà xuất Trẻ, 2001 [2] Kỹ sư Phạm Quang Huy, “Giáo trình thiết kế Web làm hoạt hình”, NXB Giao thơng vận tải, 2003 [3] Hồng Hải , “Giáo trình tự học thiết kế Web động”, NXB Lao động Xã Hội, 2007 110 ... liệu, Lập trình trực quan - Tính chất: mơ đun đào tạo nghề - Ý nghĩa vai trò: dùng đào tạo kỹ thiết kế lập trình web, cho trình độ cao đẳng nghề quản trị mạng máy tính Mục tiêu mơ đun: - Về kiến... THIỆU Chương trình khung quốc gia nghề Quản trị mạng máy tính xây dựng sở phân tích nghề, phần kỹ thuật nghề kết cấu theo môđun, môn học Để tạo điều kiện thuận lợi cho sở dạy nghề trình thực hiện,... hướng kết cách thiết kế Web site + Có khả sử dụng thẻ HTML + Biết cách tổ chức thông tin trang chủ - Về kỹ năng: + Thiết kế giao diện + Lập trình website + Sử dụng thành thạo công cụ thiết kế Web
