BÀI TẬP ASP.NET

Khi thi hành, xuất hiện thông tin: Bây giờ là … oChuỗi Chào các bạn …: Nhập trực tiếp trên trang Web Yêu cầu thiết kế: 1 Thoi_gian Label Html Dùng để hiển thị ngày giờ hiện hành trên ser

1.Cài đặt Web Server

Phần thực hành này hướng dẫn học viên cài đặt Web Server Xem giáo trình trang 16-18

2.Kiểm tra trạng thái của Web Server

Sau khi thực hiện xong phần cài đặt Web Server, học viên tiến hành thực hiện kiểm tra trạngthái hoạt động của Web Server Xem giáo trình trang 18-19

3.Tạo ứng dụng Web với Visual Studio.Net

Phần thực hành này giúp các bạn làm quen với môi trường phát triển ứng dụng VisualStudio Net

Khởi động Visual Studio Net để tạo một ứng dụng Web có tên Minh_hoa Thực hiện một sốthao tác sau:

 Thêm mới một trang default.aspx vào ứng dụng

 Xác định trang default.aspx là trang khởi động Thi hành ứng dụng

4.Sử dụng Internet Information Services (IIS)

Ở phần này, các bạn sẽ được thực hiện các thao tác quản lý ứng dụng web với IIS

Khởi động IIS:

 Quan sát các thư mục, ứng dụng có trong Defautl Web Site

 Xóa cấu hình ứng dụng web vừa tạo có tên Minh_hoa (có trong nhánh Default web

site)

 Quan sát biểu tượng thay đổi Thi hành ứng dụng và nhận xét

 ·Cấu hình lại ứng dụng Web cho thư mục Minh_hoa Thi hành ứng dụng

Internet Information Services (IIS) Manager

Tạo Virtual Directory:

 Xóa cấu hình ứng dụng web vừa tạo có tên Minh_hoa

 Di chuyển thư mục Minh_hoa sang ổ đĩa D:\

 Tạo Virtual Directory với Alias là Minh_hoa đến thư mục D:\Minh_hoa

 Mở project Minh_hoa và thi hành ứng dụng

5.Tạo WebSite mới (đối với Windows Server 2003) - (Bài làm thêm)

Mặc định, các ứng dụng nằm trong nhánh Default Web Site Chúng ta có thể thực hiện tạo mộtWeb Site mới (ví dụ: Hoc_lt_web chẳng hạn)

 Khởi động IIS, chọn WebSite, chọn New từ thực đơn ngữ cảnh  Web Site…

Tạo mới website với IIS

 Nhập tên WebSite (ví dụ: Hoc_lt_web), xác định thư mục ánh xạ, …

 Chọn Default Web Site, dừng trạng thái hoạt động của Default Web Site bằng cách nhấn

vào nút Stop item

 Khởi động web site mới vừa tạo: Chọn web site Hoc_lt_web, khởi động web site này

bằng cách nhấn vào nút Start item

6.Tổ chức thư mục lưu trữ ứng dụng

Trong thư mục minh họa, tạo các thư mục theo tổ chức sau:

Tổ chức thư mục lưu trữ

7.Thiết kế trang index.aspx

Trang index.aspx được thiết kế có nội dung như sau:

index.aspx

2 WEB SERVER CONTROL

Bài tập trong phần này chủ yếu giúp các học viên làm quen với các điều khiển trong ASP.Net Trong phần đầu của bài tập này, có một số bài tập liên quan đến các điều khiển HTML nhằm rèn luyện và củng cố lại các kiến thức về các tag HTML Phần sau của bài này giúp các bạn tìm hiểu và sử dụng các điều khiển lập trình ớ phía Server: ASP Server Control.

Sử dụng HTML control

Trong phần này, các bạn sử dụng điều khiển HTML control, bổ sung thuộc tính runat=Server

để thực hiện lập trình ở phía server

1.Tạo trang Chao.aspx

Thiết kế trang Chao.aspx Khi thi hành, xuất hiện thông tin: Bây giờ là …

oChuỗi Chào các bạn …: Nhập trực tiếp trên trang Web

Yêu cầu thiết kế:

1 Thoi_gian Label (Html) Dùng để hiển thị ngày giờ hiện hành trên server

Các thủ tục nhập xuất

·Gán chuỗi: Bây giờ là … cho thuộc tínhInnerHTML của điều khiển Thoi_gian

·Thử gián cho thuộc tính InnerText để nhận

Trang Tong_hai_so.aspx

Yêu cầu thiết kế: Sử dụng Table để trình bày nội dung trang web

Các thủ tục nhập xuất

·Gán giá trị tổng cho thuộc tính Value của Tong_so

Xử lý sự kiện

3.Tạo trang web: Hs_khach_hang.aspx

Sử dụng phối hợp các điều khiển HTML (Không cần thực hiện các thao tác kiểm tra dữ liệu)Yêu cầu thiết kế: Sử dụng Table để trình bày nội dung trang web

1 Ten_dang_nhap Text Field

2 Mat_khau, Nhap_lai Password Field

4 Ngay_sinh, Thang_sinh,

Nam_sinh

<select size="1" name="Thang_sinh"> <option selected value="0">Tháng</option>

<option value="1">1</option> <option value="2">2</option>

</select>

5 Email Text Field

6 Nam , Nu Radio Button Hai điều khiển này cùng có thuộc tính name=Phai

<input type="radio" value=" Nam " name="Phai" checked>

<input type="radio" value="Nu" name="Phai">

7 Dia_chi, Dien_thoai Text Field

Xử lý sự kiện

4.Tạo trang Upload_file.aspx

Xử lý upload tập tin lên server

Yêu cầu thiết kế:

Khi thi hành:

Upload tập tin lên Server

Sử dụng ASP.Net web control

Bài tập trong phần này giúp các bạn làm quen với các điều khiển Web control

Web control  HTML Control

<asp:textbox> <input type=text>

<asp:button> <input type=submit>

<asp:imagebutton> <input type=image>

<asp:checkbox> <input type=checkbox>

<asp:radiobutton> <input type=radiobutton>

<asp:listbox> <select size="5"> </select>

<asp:dropdownlist> <select> </select>

<asp:hyperlink> <a href="…"> </a>

<asp:image> <img src="…">

<asp:label> <span> </span>

<asp:panel> <div> </div>

<asp:table> <table> </table>

5.Tạo trang Label.aspx

Yêu cầu thiết kế:

Yêu cầu xử lý:

· Xử lý sự kiện Page_Load để hiển thị thông tin theo yêu cầu

6.Tạo trang Hyperlink.aspx

Sử dụng điều khiển Hyperlink

2 Asp_Net Hyperlink Liên kết đến trang: http://www.asp.net (Lấy hình từ trang này)

Yêu cầu: Mở ra trang mới khi nhấn vào liên kết này

7.Tạo trang ListBox.aspx

Yêu cầu thiết kế:

1 Ds_Khu_du_lich ListBox Danh sách các khu du lịch Cho phép chọn nhiều

2 Chon_dia_diem Button (Html)

Các thủ tục nhập xuất, xử lý

2 Xuat_muc_chon Không Không Xuất danh sách các khu du lịch được chọn

Xử lý sự kiện

Mở rộng: Có thể thiết kế 2 ListBox, thực hiện chọn các khu du lịch từ ListBox này qua ListBoxkia.

8.Tạo trang Thu_nhap.aspx

Yêu cầu thiết kế:

1 Ds_Thu_nhap RadioButtonList Danh sách các mức thu nhập (Có thể bổ sung thêm)

Các thủ tục nhập xuất, xử lý:

Học viên có thể làm trong lúc thiết kế

Xử lý sự kiện

: Để sự kiện SelectedIndexChanged xảy ra khi chọn thu

nhập, chọn thuộc tính AutoPostBack = True

9.Tạo trang RadioButtonList.aspx

Bài tập này tương tự như bài trên Yêu cầu sử dụng ArrayList/SortedList để liên kết dữ liệu.Hướng dẫn:  Xem cách liên kết dữ liệu với điều khiển trong giáo trình - chương 3 - trang 72

Yêu cầu thiết kế:

1 Ds_Binh_chon RadioButtonList Danh sách các tiện ích của điện thoại di động

Các thủ tục nhập xuất, xử lý:

Kết quả thi hành

Xử lý sự kiện

10.Tạo trang Validation.aspx

Trang Hs_khach_hang.aspx

Yêu cầu thiết kế: Trong phần này chỉ mô tả các Validation Control

ErrorMessage: Tên đăng nhập không được rỗng

ErrorMessage: Mật khẩu không được rỗng

Display: DynamicErrorMessage: Nhập lại mật khẩu không được rỗng

ControlToCompare: Mat_khauErrorMessage: Mật khẩu nhập lại chưa đúng

5 rfvHo_khach_hang RequiredField ControlToValidate: Ho_khach_hang

ErrorMessage: Họ khách hàng không được rỗng

6 rfvTen_khach_hang RequiredField ControlToValidate: Ten_khach_hang

ErrorMessage: Tên khách hàng không được rỗng

Operator: DataTypeCheck

Type: Integer

ErrorMessage: Chưa chọn ngày sinh

Operator: DataTypeCheck

Type: IntegerErrorMessage: Chưa chọn tháng sinh

Operator: DataTypeCheck

Type: IntegerErrorMessage: Chưa chọn năm sinh

ValidationExpression: Internet EmailErrorMessage: Email không hợp lệ

MaximumValue: 50000000MinimumValue: 1000000

Type: IntegerErrorMessage: Thu nhập từ 1 triệu đến 50 triệu

ShowMessageBox: True

Thuộc tính Text của các điều khiển validation: (*) Nếu các dữ liệu nhập hợp lệ, xuất hồ sơ khách hàng

theo mẫu bên dưới

11.Tạo trang AdRotator.aspx

Sử dụng AdRotator làm banner quảng cáo Lên các trang tin tức điện tử, download một số hìnhquản cáo để sử dụng cho ví dụ minh họa này

Hình download lưu trong thư mục: Hinh_anh/Quang_cao

12.Tạo trang Table.aspx

Yêu cầu thiết kế:

Thực hiện các thao tác định dạng Table trong lúc thiết kế: đường viền, màu đường viền, …

Các thủ tục nhập xuất, xử lý:

pSo_cot: int

KhôngXử lý tạo bảng với số dòng, số cột tương ứng

Mở rộng: Trong quá trình tạo bảng, học viên cóthể thêm những những điều khiển vào các

ô (cell) của Table

Xử lý sự kiện

Kết quả thi hành

13.Tạo trang Calendar.aspx

Yêu cầu thiết kế: Thực hiện định dạng hiển thị cho điều khiển Calendar theo mẫu

Các thủ tục nhập xuất, xử lý:

2 Chon_ngay_sinh Không KhôngXuất thông báo tương ứng giữa ngày hiện hành và

ngày sinh

Xử lý sự kiện

3 XỬ LÝ DỮ LIỆU VỚI ADO.NET

Bài tập trong phần này chủ yếu tập trung vào 2 kỹ năng sau:

 Liên kết dữ liệu với ADO.Net: Thực hiện các thao tác đọc và cập nhật dữ liệu

 Sử dụng các điều khiển: DataGrid, DataList, Repeater để hiển thị dữ liệu

Trong phần này, chúng ta sử dụng CSDL Quản lý bán hàng (xem phụ lục A - giáo trình)

1.Tạo trang Luoi.aspx

Sử dụng ADO.Net để đọc và hiển thị thông tin bảng khách hàng từ CSDL lên lưới

Sử dụng điều khiển DataGrid

Yêu cầu thiết kế:

Các thủ tục nhập xuất, xử lý:

1 Doc_ds_khach_hang Không DataTable Đọc danh sách khách hàng có trong CSDL

2 Lien_ket_du_lieu Không Không Thực hiện liên kết lưới với nguồn dữ liệu

Xử lý sự kiện

Kết quả hiển thị

2.Tạo trang Luoi_dinh_dang.aspx

Định dạng hình thức hiển thị: Tiêu đề, định dạng hiển thị ngày tháng, …

Các yêu cầu thiết kế, thủ tục xử lý, nhập xuất và xử lý sự kiện tương tự bài 4.1

3.Tạo trang Luoi_sap_xep.aspx

Yêu cầu thiết kế:

Các thủ tục nhập xuất, xử lý:

1Doc_ds_khach_hang pChuoi_sap_xep DataTableĐọc danh sách khách hàng có trong CSDL được sắp

Mặc định ="" xếp theo giá trị từ tham số truyền vào.

2 Lien_ket_du_lieuKhông Không Thực hiện liên kết lưới với nguồn dữ liệu

Xử lý sự kiện

4.Tạo trang Luoi_phan_trang.aspx

Xử lý thao tác phân trang trên lưới

Các yêu cầu thiết kế, thủ tục xử lý, nhập xuất và xử lý sự kiện tương tự bài 4.2

Yêu cầu thiết kế (Bổ sung): Thiết kế lưới cho phép phân trang

Xử lý sự kiện (Bổ sung)

1 Luoi_Khach_hang PageIndexChanged Xử lý phân trang dữ liệu trên lưới:

·<lưới>.CurrentPageIndex = e.NewPageIndex

·Lien_ket_du_lieu

5.Tạo trang Luoi_sx_pt.aspx - (Bài làm thêm)

Kết hợp xử lý chức năng sắp xếp và phân trang trên lưới.

6.Tạo trang Luoi_tuy_bien.aspx

Xử lý tùy biến cột hiển thị trên lưới

Các yêu cầu thiết kế, thủ tục xử lý, nhập xuất và xử lý sự kiện tương tự bài 4.2

Yêu cầu thiết kế (Bổ sung): Cột phái hiển thị checkbox thay thế cho Nam/Nữ

Xử lý sự kiện (Bổ sung)

1 Luoi_Khach_hang ItemDataBound Xử lý hiển thị checkbox thay cho cột phái

(Có thể thực hiện liên kết dữ liệu trong lúc thiết kế)

Mở rộng: Tại cột phái ta có 2 biểu tượng Nam/Nữ Tùy theo phái của khách hàng là Nam hay

Nữ mà ta hiển thị các biểu tượng tương ứng

Thư mục hình: C:\Program Files\Microsoft Visual Studio\COMMON\Graphics\Icons\Misc

7.Tạo trang Luoi_cap_nhat.aspx

Thực hiện các thao tác chọn/cập nhật/xóa khách hàng trên lưới

Các yêu cầu thiết kế, thủ tục xử lý, nhập xuất và xử lý sự kiện tương tự bài 4.2

Yêu cầu thiết kế:

1 Luoi_Khach_hang DataGrid·Hiển thị danh sách khách hàng Bổ sung các nút chức năng:

Select, Edit|Update|Cancel, Delete

·Định dạng dòng được chọn, dòng đang hiệu chỉnh, …

Các thủ tục nhập xuất, xử lý:

1 Doc_ds_khach_hang Không DataTable Đọc danh sách khách hàng có trong CSDL

2 Lien_ket_du_lieu Không Không Thực hiện liên kết lưới với nguồn dữ liệu

Xử lý sự kiện

2 Luoi_Khach_hang ItemDataBound Xử lý hiển thị cột Phái - Có thể thực hiện lúc thiết kế

EditCommand Xử lý hiệu chỉnh thông tin khách hàng

Không cho phép cập nhật Mã khách hàng.UpdateCommand Xử lý cập nhật thông tin khách hàngCancelCommand Xử lý phục hồi thông tin khách hàng

Nếu khách hàng đã có đơn đặt hàng  Không cho xóa

Mở rộng: Hỏi người dùng có đồng ý xóa khách hàng này không

8.Tạo trang Ds_Sach.aspx

Hiển thị thông tin sách sử dụng DataList

Thiết kế thông tin sách với DataList

Yêu cầu thiết kế:

Các thủ tục nhập xuất

1 Doc_ds_sach Không DataTable Đọc danh sách Sách có trong CSDL

2 Lien_ket_du_lieu Không Không Thực hiện liên kết datalist với nguồn dữ liệu

Xử lý sự kiện

2 Luoi_Sach ItemDataBoundXử lý hiển thị thông tin Sách: Tên sách, Nhà xuất bản, Mô tả, …

Khi di chuyển chuột vào Tên sách, Hình minh họa,

 Liên kết đến trang: Ds_Sach_Ct.aspx?Ms=xxx

xxx: Mã sách của cuốn sách tương ứng.Khi di chuyển chuột vào Chọn mua,

 Liên kết đến trang: Dat_mua.aspx?Ms=xxx

xxx: Mã sách của cuốn sách tương ứng

Kết quả hiển thị

Mở rộng:

·Bổ sung thêm một số thông tin liên quan: Tác giả, số trang, …

·Xử lý chọn Nhà xuất bản  Liên kết đến trang hiển thị các sách của nhà xuất bản

·Xử lý chọn Tác giả  Liên kết đến trang hiển thị các sách có tác giả tham gia biên soạn

Học viên có thể thiết kế bổ sung vào mẫu trên hay thiết kế theo mẫu bên dưới:

9.Tạo trang Ds_Sach_Liet_ke.aspx - (Bài làm thêm)

Hiển thị thông tin sách sử dụng DataList

10.Tạo trang Repeater.aspx

Hiển thị danh sách khách hàng sử dụng Repeater

Yêu cầu thiết kế:

Stt Tên điều khiển Kiểu Ý nghĩa và thuộc tính

Các thủ tục nhập xuất, xử lý:

1 Doc_ds_khach_hang Không DataTable Đọc danh sách khách hàng có trong CSDL

2 Lien_ket_du_lieu Không Không Thực hiện liên kết lưới với nguồn dữ liệu

Xử lý sự kiện

Danh sách khách hàng sử dụng Repeater

11.Bài tập tương tự - (Bài làm thêm)

Trong phần này, chúng tôi gợi ý một số bài tập Học viên tự thiết kế và xây dựng (hoặc do giáo viên hướng dẫn) Tùy theo thời gian và khả năng của mình, học viên có thể thực hiện tất cả những bài tập hoặc một số bài trong những bài dưới đây.

 Hiển thị danh sách các tác giả

 Hiển thị danh sách các khách hàng thân thuộc

Hd: Bổ sung thêm một cột: La_khach_hang_tt - kiểu luận lý vào bảng KHACH_HANG Học viên

có thể bổ sung thêm hình ảnh cho khách hàng để hiển thị được sinh động hơn

 Hiển thị danh sách các nhà xuất bản

 Hiển thị danh sách các chủ đề

Bài tập này chủ yếu để rèn luyện thêm kỹ năng đọc và hiển thị dữ liệu với các điều khiểnDataGrid, DataList và Repeater Học viên có thể tùy chọn (hoặc theo yêu cầu của giáo viên) cácđiều khiển để xây dựng các màn hình trên

Trong các bài tập, học viên tự tạo thêm các hiệu ứng, tô màu theo điều kiện, tạo biểu tượngsắp xếp dữ liệu

4 XÂY DỰNG LỚP XỬ LÝ

Trong phần này, các bạn xây dựng các lớp xử lý đảm trách các thao tác truy xuất và cập

nhật dữ liệu Các lớp xử lý này có khuôn mẫu chung, các bạn có thể tham khảo trong chương 5 của giáo trình.

1.Xây dựng lớp xử lý chủ đề: XL_CHU_DE.vb

Đảm nhận trách nhiệm truy xuất và cập nhật dữ liệu lên bảng CHU_DE

2.Xây dựng lớp xử lý sách: XL_SACH.vb

Đảm nhận trách nhiệm truy xuất và cập nhật dữ liệu lên bảng SACH

3.Xây dựng lớp xử lý tác giả: XL_TAC_GIA.vb

Đảm nhận trách nhiệm truy xuất và cập nhật dữ liệu lên bảng TAC_GIA

4.Xây dựng lớp xử lý nhà xuất bản: XL_NHA_XUAT_BAN.vb

Đảm nhận trách nhiệm truy xuất và cập nhật dữ liệu lên bảng NHA_XUAT_BAN

5.Xây dựng lớp xử lý khách hàng: XL_KHACH_HANG.vb

Đảm nhận trách nhiệm truy xuất và cập nhật dữ liệu lên bảng KHACH_HANG

Các bài tập làm thêm:

6.Xây dựng lớp xử lý đơn đặt hàng: XL_DON_DAT_HANG.vb

Đảm nhận trách nhiệm truy xuất và cập nhật dữ liệu lên bảng DON_DAT_HANG

7.Xây dựng lớp xử lý chi tiết đặt hàng: XL_CT_DAT_HANG.vb

Đảm nhận trách nhiệm truy xuất và cập nhật dữ liệu lên bảng CT_DAT_HANG

8.Xây dựng lớp xử lý thăm dò: XL_THAM_DO.vb

Đảm nhận trách nhiệm truy xuất và cập nhật dữ liệu lên bảng THAM_DO

9.Xây dựng lớp xử lý thăm dò chi tiết (bình chọn): XL_THAM_DO_CT.vb

Đảm nhận trách nhiệm truy xuất và cập nhật dữ liệu lên bảng THAM_DO_CT

5 JAVASCRIPT (*)

Đây là phần bài tập làm thêm dành cho những học viên muốn tìm hiểu thêm về ngôn ngữ JavaScript.

Do vậy, để cho việc học đơn giản hơn, các bài tập trong phần này sử dụng các điều khiển HTML

1.Tạo trang Dang_ky.htm

Bài tập này giúp học viên sử dụng ngôn ngữ JavaScript để truy xuất giá trị đến các điều khiểnHTML

Khi thiết kế

Các thủ tục nhập xuất, xử lý:

1 Xuat_thong_tin_dang_nhap Không Không Xuất các thông tin đăng nhập do người

dùng nhập vào theo mẫu bên dưới

Xuất thông tin đăng nhập

Xử lý sự kiện

2.Tạo trang Muc_chon.htm

Ở bài tập này, học viên sẽ làm việc với ListBox và ComboBox (tag Select) để xử lý mục chọn

Xử lý các mục chọn với ListBox và ComboBox

Các thủ tục nhập xuất, xử lý:

1 Chon_nghe_nghiep Không Không Xuất thông báo về nghề nghiệp đang được chọn

2 Chon_so_thich Không Không Xuất thông báo về các sở thích đang được chọn

Xử lý sự kiện

Xuất các sở thích được chọn

3.Tạo trang Listbox.htm

Thiết kế trang Chao.aspx Khi thi hành, xuất hiện thông tin: Bây giờ là …