intTypePromotion=1
zunia.vn Tuyển sinh 2024 dành cho Gen-Z zunia.vn zunia.vn
ADSENSE

HƯỚNG DẪN THỰC HÀNH WEB.

Chia sẻ: Phamngoc Linh | Ngày: | Loại File: PDF | Số trang:71

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

Website là tập hợp của rất nhiều trang web - một loại siêu văn bản (tập tin dạng HTML hoặc XHTML) trình bày thông tin trên mạng Internet- tại một địa chỉ nhất định để người xem có thể truy cập vào xem. Trang web đầu tiên người xem truy cập từ tên miền thường được gọi là trang chủ (homepage), người xem có thể xem các trang khác thông qua các siêu liên kết (hyperlinks).. Để thành công, tài liệu sẽ hướng dẫn các bạn thực hiện nhé....

Chủ đề:
Lưu

Nội dung Text: HƯỚNG DẪN THỰC HÀNH WEB.

  1. Tài Liệu HƯỚNG DẪN THỰC HÀNH WEB
  2. LẬP TRÌNH WEB CHƯƠNG 6: HƯỚNG DẪN THỰC HÀNH Bài 1: Xây dựng ứng dụng WebCalculator 1. Tạo một Web site  Từ Menu chọn File - New - Web site o Template : ASP.NET Web site o Location : File System o Language : Visu al C# 2. Thiết kế Form theo mẫu Tạo table : Menu Layout - Insert Table  Kéo thả các Control trong Toolbox vào WebForm.aspx như mẫu trên.  Đặt thuộc tính cho các đối tượng trên Form Dzoaõn Thanh 1
  3. LẬP TRÌNH WEB 3 Viết mã lệnh xử lý  Viết hàm xử lý sự kiện bấm vào nút Tổng.  Bấm đ úp (double click) vào nút Tổng trên form sẽ tự động thêm 1 hàm xử lý sự kiện protected void btTong_Click(object sender, EventArgs e) { }  Nhập đoạn mã lệnh (in đậm) vào trong thân hàm vừa phát sinh: protected void btTong_Click(object sender, EventArgs e) { int so1, so2, tong; so1 = int.Parse(txtSo1.Text); so2 = int.Parse(txtSo2.Text); tong = so1 + so2; txtTong.Text = tong.ToString(); } 4. Lưu trữ dạng Unicode :  Giải thích: Các Form hoặc User Control trong 1 ứng dụng ASP.NET không mặc định được lưu theo d ạng có hỗ trợ Font Unicode. Vì vậy khi chạy ứng dụng từ Browser sẽ không hiển thị đúng Font chữ tiếng Việt.  Cách sửa: Nếu có sử dụng Font Unicode trong file nào thì cần phải chỉ định cho VS.NET lưu file đó theo đúng định dạng Unicode. o Từ menu chọn File\Save As. Từ hộp thoại Save File As, Từ hộp thoại Encoding . chọn Save File As, Save with Dzoaõn Thanh 2
  4. LẬP TRÌNH WEB 5 Chạy kiểm thử chương trình Dzoaõn Thanh 3
  5. LẬP TRÌNH WEB Bài 2. Xây dựng trang chủ cho Website Bản tin điện tử 1. Mẫu trang chủ Website Tuổi trẻ (www.tuoitre.com.vn) 2. Tạo Project Bản tin điện tử o Từ Menu chọn File – New – Web site… • Template : ASP.NET We site • Location : File System – D:\BanTinDienTu • Language : Visual C# 3. Tạo trang Master o Từ Menu chọn Website – Add new item… • Template : Master page • Name : MasterPage.master • Language : Visual C# Dzoaõn Thanh 4
  6. LẬP TRÌNH WEB o Chuyển sang màn hình design - Xóa tất cả các control có trên đó o Thêm một table : Menu Layout – Insert table Dzoaõn Thanh 5
  7. LẬP TRÌNH WEB Vùng hiển thị Banner Vùng hiển thị Menu Vùng hiển thị Marquee Vùng hiển thị Nội dung Vùng hiển thị AdRotaror Vùng hiển thị Image Copyright@ By 063T 4. Tạo hiển thị Banner o Sử dụng Image Control: • Kéo thả 1 Image Control vào vùng hiển thị Banner. • Đặt thuộc tính ImageUrl của Image là Images\banner.gif Dzoaõn Thanh 6
  8. LẬP TRÌNH WEB 5. Tạo hiển thị Menu cột trái o Sử dụng H yperlink Control: • Kéo thả các 4 Hyperlink Control vào vùng hiển thị Menu. • Đặt thuộc tính cho các Hyperlink. Control Property Value Trang chủ Hyperlink1 Text NavigateUrl Index.aspx Xã hội Hyperlink2 Text NavigateUrl Xahoi.aspx Kinh tế Hyperlink3 Text NavigateUrl Kinhte.aspx Thể thao Hyperlink4 Text NavigateUrl Thethao.aspx o Sử dụng AdRotator: • Từ Menu chọn Project\Add New Item, chọn XML File từ ô cửa sổ Template, đặt tên file là Ads.xml. Dzoaõn Thanh 7
  9. LẬP TRÌNH WEB o Ta thêm nội dung của file Ads.xml như sau: < Advertisements> < Ad> Images\Quang_cao\qc_Ao_cuoi.jpg http://www. qc_Ao_cuoi..com Quảng cáo áo cưới 80 quangcao < /Ad> < Ad> Images\ Quang_cao \qc_Mouse.jpg http://www.phongvu.com Images\ Quang_cao \qc_Trang_suc.jpg http://www.trangsuc.com o Kéo thả các 1 AdRotator Control vào menu o Chỉ đường dẫn thuộc tính AdvertisementFile là Ads.xml Dzoaõn Thanh 8
  10. LẬP TRÌNH WEB 6. Tạo và hiển thị cột quảng cáo bên phải o Sử dụng Marquee Đưa con trỏ vào vùng cần hiển thị định dạng marquee, chọn View HTML Source Ví dụ nội dung marquee như sau
  11. LẬP TRÌNH WEB 7. Tạo hiển thị phần nội dung : o Vào vùng hiển thị nội dung thêm control ContentPlaceHolder Dzoaõn Thanh 10
  12. LẬP TRÌNH WEB 8. Tạo Trang chủ Bản tin điện tử o Vào Menu Website – Add new item • Template : Webform • Name : index.aspx • Language : Visual C# • Chọn : Select master page Dzoaõn Thanh 11
  13. LẬP TRÌNH WEB Nhập nội dung trang Default.aspx F5 - Chạy chương trình. o Tương tự : xây dựng 3 trang XaHoi.aspx, KinhTe.aspx, TheThao.aspx với kết thừa từ trang master page Dzoaõn Thanh 12
  14. LẬP TRÌNH WEB Bài 3. Xây dựng trang web Nhập tin tức mới 1. Thiế kế Cơ sở dữ liệu (Xây dựng CSDL Access) o Mở ứng dựng Microsoft Access o Thiết kế CSDL, đặt tên là tintuc.MDB, có cấu trúc gồm: - Một bảng Bantin như sau: Bantin STT Kiểu dữ liệu Ghi chú Tên trường 1 MaBanTin Text(10) Primary Key 2 TieuDe Text (255) Required 3 NoiDungTomTat Memo Required 4 NoiDung Memo Required 5 NgayDangTin Date/Time Ngày hiện hành 6 HinhAnh Text(255) 7 ChuThichHinh Text(255) 8 MaLinhVuc Text(10) Foreigned Key - Một bản Linhvuc: Linhvuc STT Kiểu dữ Ghi chú Tên trường liệu 1 MaLinhvuc Text(10) Primary Key 2 Tenlinhvuc Text (255) Required o Lưu tintuc.MDB vào thư mục App_Data trong thư mục gốc chứa trang web 2. Thêm một trang mới và Thiết kế Form theo mẫu dưới đây (dùng control AccessDataSource) Dzoaõn Thanh 13
  15. LẬP TRÌNH WEB o Xử lý : Khi nhấn nút Lưu, d ữ liệu trên from sẽ được lưu xuống table Linhvuc trong Database (Access) Tạo 1 contro l AccessDataSource o Từ Toolbox – Kéo thả 1 control AccessDataSource o Phải chuột vào control AccessDataSource chọn “Configure Data Source …” Chọn đường dẫn đến file tintuc.mdb -> Next o Chọn “Specify columns from a table or view” o Name : Bantin o Columns : chọn * (Chọn các cột sẽ đ ược hiển thị trong câu truy vấn select – chọn * có nghĩa là chọn tất cả các cột) o Next Dzoaõn Thanh 14
  16. LẬP TRÌNH WEB o Chọn Advanced … Chọn “Generate INSERT, UPDATE, and DELETE statements” (Tự động tạo các câu truy vấn INSERT, UPDATE, DELETE) -> Next -> Finish Dzoaõn Thanh 15
  17. LẬP TRÌNH WEB o Phải chuột AccessDataSource1, chọn Property, chọn thuộc tính “InsertQuery” o Liên kết 1 cột trong bảng với 1 control trong màn hình (ví dụ cột Malinhvuc liên kết với control txtMalinhvuc) o Parameters : Malinhvuc o Parameter source : Control o ControlID : txtMalinhvuc o Viết hàm xử lý sự kiện click cho nút Lưu (Bấm đúp (double click) vào nút Lưu trên form, chương trình sẽ tự động thêm hàm xử lý sự kiện) protected void btnLuu_Click(object sender, EventArgs e) { AccessDataSource1.Insert(); } F5- Chạy chương trình và nhập nội dung Dzoaõn Thanh 16
  18. LẬP TRÌNH WEB 3.Thêm một trang mới và Thiết kế Form theo mẫu dưới đây: (txtMabantin) (txtTieude) (txtNoidungtomtat) (txtNoidung) (txtCldNgaydangtin) (txtUploadFile) (txtChuthichhinh) (cmdLuu) (cmdXoa) o Xử lý: - Lấy data từ table Linhvuc load lên DropdownList Linhvuc tren form (Sinh viên tự thực hành phần này) - Mặc định CldCldNgaydangtin là chọn ngày hiện hành - Nhấn nút Lưu, tất cả dữ liệu sẽ đ ược lưu xuống table Bantin trong database Tương tự như trang Thêm Lĩnh vực, ta tạo 1 control AccessDataSource o Từ Toolbox – Kéo thả 1 control AccessDataSource o Phải chuột vào control AccessDataSource chọn “Configure Data Source …” Chọn đường dẫn đến file tintuc.mdb -> Next o Chọn “Specify columns from a table or view” o Name : Bantin Dzoaõn Thanh 17
  19. LẬP TRÌNH WEB o Columns : chọn * (Chọn các cột sẽ đ ược hiển thị trong câu truy vấn select – chọn * có nghĩa là chọn tất cả các cột) o Next o Chọn Advanced … Chọn “Generate INSERT, UPDATE, and DELETE statements” (Tự động tạo các câu truy vấn INSERT, UPDATE, DELETE) -> Next -> Finish o Phải chuột AccessDataSource1, chọn Property, chọn thuộc tính “InsertQuery” o Liên kết 1 cột trong bảng với 1 co ntrol trong màn hình (ví dụ cột MaBanTin liên kết với control txtMaBanTin) o Parameters : Mabantin o Parameter source : Control o ControlID : txtMabantin o Tương tự cho các cột o TieuDe o NoiDung o NoiDungTomTat o NgayDangTin o ChuThichHinh o Malinhvuc o *Riêng cột HinhAnh : Bấm vào “Show advanced properties” ,Properties : PropertyName chọn FileName Dzoaõn Thanh 18
  20. LẬP TRÌNH WEB o Viết hàm xử lý thông tin cho Trang Nhập Tin tức mới, - Hàm load ngày mặc định là ngày hiện hành cho control Ngày đăng tin p rotected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) cldNgaydangtin.SelectedDate = DateTime.Now; } - Hàm Nhận tập tin Upload từ Client và Lưu lên Server p rotected void SaveFileUpload() { string strFileName; if (txtFileUpload.FileName != "") { strFileName = Server.MapPath("Upload \\" + txtFileUpload.FileName); txtFileUpload.PostedFile.SaveAs(strFileName); } } - Hàm xử lý sự kiện click cho nút Lưu (Bấm đúp (double click) vào nút Lưu trên form, chương trình sẽ tự động thêm hàm xử lý sự kiện) Dzoaõn Thanh 19
ADSENSE

CÓ THỂ BẠN MUỐN DOWNLOAD

 

Đồng bộ tài khoản
4=>1