›
›

Giáo trình Lập trình web với ASP.Net - Nghề: Thiết kế trang web - Trình độ: Cao đẳng

pdf 91 trang Gia Huy 17/05/2022 2600
Download
Bạn đang xem 20 trang mẫu của tài liệu "Giáo trình Lập trình web với ASP.Net - Nghề: Thiết kế trang web - Trình độ: Cao đẳng", để tải tài liệu gốc về máy bạn click vào nút DOWNLOAD ở trên

Tài liệu đính kèm:

  • pdfgiao_trinh_lap_trinh_web_voi_asp_net_nghe_thiet_ke_trang_web.pdf

Nội dung text: Giáo trình Lập trình web với ASP.Net - Nghề: Thiết kế trang web - Trình độ: Cao đẳng

  1. ỦY BAN NHÂN DÂN TỈNH LÂM ĐỒNG TRƢỜNG CAO ĐẲNG NGHỀ ĐÀ LẠT GIÁO TRÌNH MÔN HỌC/ MÔ ĐUN: LẬP TRÌNH WEB VỚI ASP.NET NGÀNH/ NGHỀ: THIẾT KẾ TRANG WEB TRÌNH ĐỘ: CAO ĐẲNG Ban hành kèm theo Quyết định số: 1157/QĐ-CĐNĐL ngày 11 tháng 12 năm 2019 của Hiệu trưởng Trường Cao đẳng Nghề Đà Lạt (LƢU HÀNH NỘI BỘ) Lâm Đồng, năm 2019
  2. TUYÊN BỐ BẢN QUYỀN Tài liệu này thuộc loại sách giáo trình nên các nguồn thông tin có thể được phép dùng nguyên bản hoặc trích dùng cho các mục đích về đào tạo và tham khảo. Mọi mục đích khác mang tính lệch lạc hoặc sử dụng với mục đích kinh doanh thiếu lành mạnh sẽ bị nghiêm cấm. Giáo trình được lưu hành nội bộ Trường Cao đẳng Nghề Đà Lạt.
  3. LỜI GIỚI THIỆU Vài nét về xuất xứ giáo trình: Giáo trình này được viết theo căn cứ Thông tư số 03/2017/TT-BLĐTBXH ngày 01 tháng 03 năm 2017 của Bộ Lao động – Thương binh và Xã hội về việc Quy định về quy trình xây dựng, thẩm định và ban hành chương trình; tổ chức biên soạn, lựa chọn, thẩm định giáo trình đào tạo trình độ trung cấp, trình độ cao đẳng. Quá trình biên soạn: Giáo trình này được biên soạn có sự tham gia tích cực của các giáo viên có kinh nghiệm, cùng với những ý kiến đóng góp quý báu của các chuyên gia về lĩnh vực công nghệ thông tin. Mối quan hệ của tài liệu với chương trình, mô đun/môn học: Căn cứ vào chương trình đào tạo nghề Thiết kế trang web, giáo trình giúp cung cấp cho người học những kiến thức cơ bản về lập trình ASP.NET cũng như kỹ năng lập trình ứng dụng web trên server. Để học được mô đun này người học cần có kiến thức cơ bản về lập trình cơ bản và HTML. Cấu trúc chung của giáo trình: Giáo trình được tổ chức thành 8 bài. Lời cảm ơn Giáo trình được biên soạn trên cơ sở các văn bản quy định của Nhà nước và tham khảo nhiều tài liệu liên quan có giá trị. Song chắc hẳn quá trình biên soạn không tránh khỏi những thiếu sót nhất định. Ban biên soạn mong muốn và thực sự cảm ơn những ý kiến nhận xét, đánh giá của các chuyên gia, các thầy cô đóng góp cho việc chỉnh sửa để giáo trình ngày một hoàn thiện hơn. Lâm Đồng, ngày 10 tháng 12 năm 2019 Tham gia biên soạn 1. Phạm Đình Nam 2. Ngô Thiên Hoàng 3. Nguyễn Quỳnh Nguyên 4. Phan Ngọc Bảo
  4. MỤC LỤC Bài 01: TỔNG QUAN VỀ ASP.NET 1 I. Giới thiệu về ASP.Net 1 1. Tìm hiểu về ASP.Net 1 2. Những ưu điểm của ASP.Net 1 3. Quá trình xử lý tập tin ASPX 2 4. Tìm hiểu về .Net Phatform và .Net Framework 3 II. Web Server 6 1. Internet Information Services 6 2. Cài đặt Web Server 7 3. Cấu hình Internet Information Services 9 III. Tạo ứng dụng Web đầu tiên 12 1. Khởi động MS Visual Studio .Net 12 2. Tạo mới ứng dụng Web 13 3. Bổ sung các điều khiển 14 4. Thi hành ứng dụng 15 5. Phân loại tập tin trong ASP.Net 15 IV. Làm quen với các thành phần giao diện trên VS .Net 16 1. Solution Explorer 16 2. Property Window 17 3. Toolbox 17 4. Document Outline Window 18 Bài 02: WEB SERVER CONTROL 19 I. Điều khiển cơ bản chuẩn – Standard 19 1. Label 20 2. TextBox 20 3. Image 20 4. Button, ImageButton, LinkButton 21 5. HyperLink 22 6. ListBox Và DropDownList 22 7. CheckBox & RadioButton 25 8. CheckBoxList & RadioButtonList 25 II. Điều khiển kiểm tra dữ liệu III. Một số điều khiển khác IV. Đối tƣợng ViewState V. Asp.Net Page Bài 03: CÁC ĐIỀU KHIỂN LIÊN KẾT DỮ LIỆU I. Điều khiển DataGrid 62 I.1. Các thao tác định dạng lưới 62 I.2. Xử lý sắp xếp 67
  5. I.3. Xử lý phân trang 69 I.4. Tùy biến các cột 70 I.5. Cập nhật dữ liệu trực tiếp trên lưới 74 II. Điều khiển DataList 79 II.1. Sử dụng DataList để hiển thị dữ liệu 79 II.2. Cập nhật dữ liệu với DataList 83 III. Điều khiển Repeater 87 IV. Các ví dụ mở rộng 90 IV.1. Xử lý đảo hướng sắp xếp trong DataGrid 90 IV.2. Tạo biểu tượng sắp xếp trong cột cho DataGrid 91 IV.3. Định dạng hình thức hiển thị cho dòng dữ liệu thỏa điều kiện trên DataGrid 92 IV.4. Tạo hiệu ứng chọn khi rê chuột qua các dòng dữ liệu 93 Bài 4. XÂY DỰNG LỚP XỬ LÝ DỮ LIỆU 94 I. Thiết kế tổng quan 96 I.1. Cấu trúc chi tiết lớp XL_BANG 98 I.2. Xây dựng lớp xử lý nghiệp vụ 102 I.3. Sử dụng lớp xử lý nghiệp vụ 104 Bài 5 108 Tài liệu hướng dẫn giảng dạy Học phần 3 - Lập trình ứng dụng web với ASP.NET Trang 3/174 XÂY DỰNG ĐỐI TƢỢNG THỂ HIỆN 108 I. Tạo mới đối tƣợng thể hiện 109 II. Sử dụng đối tƣợng thể hiện 111 III. Tạo phƣơng thức cho đối tƣợng thể hiện 112 IV. Tạo sự kiện cho đối tƣợng thể hiện 113 IV.1. Thiết kế 114 IV.2. Xử lý 114 Bài 6 117 XÂY DỰNG VÀ QUẢN LÝ ỨNG DỤNG 117 I. Đối tƣợng Request, Response 118 I.1. Đối tượng Response 118 I.2. Đối tượng Request 120 II. Đối tƣợng Session, Application 122 II.1. Đối tượng Application 123 II.2. Đối tượng Session 124 III. Đối tƣợng Server 125 IV. Đối tƣợng Cookies 125 IV.1. Giới thiệu 125 IV.2. Làm việc với Cookies 126 V. Tập tin quản lý và cấu hình ứng dụng 127 V.1. Global.asax 127 V.2. V.2. Web.config 128 VI. Tổ chức & xây dựng ứng dụng 133
  6. VI.1. Tổ chức lưu trữ ứng dụng 133 VI.2. Xây dựng ứng dụng 134 Bài 7 136 WEB SERVICE 136 I. Tìm hiểu về Web Services 137 II. Xây dựng Web Services 140 Tài liệu hướng dẫn giảng dạy Học phần 3 - Lập trình ứng dụng web với ASP.NET Trang 4/174 II.1. Tạo Web Services trong VS .Net 140 II.2. Kiểm tra Web Service 141 III. Sử dụng Web Service 143 III.1. Sử dụng Web Service do người dùng xây dựng 144 III.2. Sử dụng Web Services được cung cấp miễn phí trên mạng 144 IV. Xây dựng Web Services truy xuất dữ liệu 148 IV.1. Web Service: WS_KHACH_HANG 148 IV.2. Sử dụng WS_KHACH_HANG 150 Bài 8 152 PHỤ LỤC 152 I. Cơ sở dữ liệu dùng trong ứng dụng 153 I.1. Thiết kế cơ sở dữ liệu 153 I.2. Dữ liệu thử 156 II. Giới thiệu về các tag HTML 157 II.1. Cơ bản về tag HTML 157 II.2. Các tag nhập liệu 163 III. Cascading Style Sheets - CSS 166 III.1. Giới thiệu CSS 166 III.2. Cú pháp CSS 167 III.3. Sử dụng CSS trong trang HTML 169
  7. Bài 01. TỔNG QUAN VỀ ASP.NET I. Giới thiệu về ASP.Net 1. Tìm hiểu về ASP.Net Từ khoảng cuối thập niên 90, ASP (Active Server Page) đã được nhiều lập trình viên lựa chọn để xây dựng và phát triển ứng dụng web động trên máy chủ sử dụng hệ điều hành Windows. ASP đã thể hiện được những ưu điểm của mình với mô hình lập trình thủ tục đơn giản, sử dụng hiệu quả các đối tượng COM: ADO (ActiveX Data Object) - xử lý dữ liệu, FSO (File System Object) - làm việc với hệ thống tập tin , đồng thời, ASP cũng hỗ trợ nhiều ngôn ngữ: VBScript, JavaScript. Chính những ưu điểm đó, ASP đã được yêu thích trong một thời gian dài. Tuy nhiên, ASP vẫn còn tồn đọng một số khó khăn như Code ASP và HTML lẫn lộn, điều này làm cho quá trình viết code khó khăn, thể hiện và trình bày code không trong sáng, hạn chế khả năng sử dụng lại code. Bên cạnh đó, khi triển khai cài đặt, do không được biên dịch trước nên dễ bị mất source code, hạn chế về mặt tốc độ thực hiện. Quá trình xử lý Postback khó khăn, Đầu năm 2002, Microsoft giới thiệu một kỹ thuật lập trình Web khá mới mẻ với tên gọi ban đầu là ASP+, tên chính thức sau này là ASP.Net. Với ASP.Net, không những không cần đòi hỏi bạn phải biết các tag HTML, thiết kế web, mà nó còn hỗ trợ mạnh lập trình hướng đối tượng trong quá trình xây dựng và phát triển ứng dụng Web. ASP.Net là kỹ thuật lập trình và phát triển ứng dụng web ở phía Server (Server-side) dựa trên nền tảng của Microsoft .Net Framework. Hầu hết, những người mới đến với lập trình web đều bắt đầu tìm hiểu những kỹ thuật ở phía Client (Client-side) như: HTML, Java Script, CSS (Cascading Style Sheets). Khi Web browser yêu cầu một trang web (trang web sử dụng kỹ thuật client-side), Web server tìm trang web mà Client yêu cầu, sau đó gởi về cho Client. Client nhận kết quả trả về từ Server và hiển thị lên màn hình. ASP.Net sử dụng kỹ thuật lập trình ở phía server thì hoàn toàn khác, mã lệnh ở phía server (ví dụ: mã lệnh trong trang ASP, ASP.NET) sẽ được biên dịch và thi hành tại Web Server. Sau khi được Server đọc, biên dịch và thi hành, kết quả tự động được chuyển sang HTML/ JavaScript/ CSS và trả về cho Client. Tất cả các xử lý lệnh ASP, ASP.Net đều được thực hiện tại Server và do đó, gọi là kỹ thuật lập trình ở phía server. 2. Những ƣu điểm của ASP.Net • ASP.Net cho phép bạn lựa chọn một trong các ngôn ngữ lập trình mà bạn yêu thích: Visual Basic.Net, J#, C#, • Trang ASP.Net được biên dịch trước thành những tập tin DLL mà Server có thể thi hành nhanh chóng và hiệu quả. Yếu tố này là một bước nhảy vọt đáng kể so với kỹ thuật thông dịch của ASP. Trang 1
  8. • ASP.Net hỗ trợ mạnh mẽ bộ thư viện phong phú và đa dạng của .Net Framework, làm việc với XML, Web Service, truy cập cơ sở dữ liệu qua ADO.Net, ASPX và ASP có thể cùng hoạt động trong 1 ứng dụng. • ASP.Net sử dụng phong cách lập trình mới: Code behide. Tách code riêng, giao diện riêng Dễ đọc, dễ quản lý và bảo trì. • Kiến trúc lập trình giống ứng dụng trên Windows. • Hỗ trợ quản lý trạng thái của các control • Tự động phát sinh mã HTML cho các Server control tương ứng với từng loại Browser • Triển khai cài đặt o Không cần lock, không cần đăng ký DLL o Cho phép nhiều hình thức cấu hình ứng dụng • Hỗ trợ quản lý ứng dụng ở mức toàn cục o Global.aspx có nhiều sự kiện hơn o Quản lý session trên nhiều Server, không cần Cookies 3. Quá trình xử lý tập tin ASPX Khi Web server nhận được yêu cầu từ phía client, nó sẽ tìm kiếm tập tin được yêu cầu thông qua chuỗi URL được gởi về, sau đó, tiến hành xử lý theo sơ đồ sau: 4. Tìm hiểu về .Net Phatform và .Net Framework .Net Phatform Bao gồm .Net Framework và những công cụ được dùng để xây dựng, phát triển ứng dụng và dịch vụ. ASP.Net. Trang 2
  9. .Net Framework Kiến trúc .Net Framework • Hệ điều hành Cung cấp các chức năng xây dựng ứng dụng với vai trò quản lý việc xây dựng và thi hành ứng dụng, .NET Framework cung cấp các lớp đối tượng (Class) để bạn có thể gọi thi hành các chức năng mà đối tượng đó cung cấp. Tuy nhiên, lời kêu gọi của bạn có được "hưởng ứng" hay không còn tùy thuộc vào khả năng của hệ điều hành đang chạy ứng dụng của bạn. Các chức năng đơn giản như hiển thị một hộp thông báo (Messagebox) sẽ được .NET Framework sử dụng các hàm API của Windows. Chức năng phức tạp hơn như sử dụng các COMponent sẽ yêu cầu Windows phải cài đặt Microsoft Transaction Server (MTS) hay các chức năng trên Web cần Windows phải cài đặt Internet Information Server (IIS). Như vậy, bạn cần biết rằng lựa chọn 1 hệ điều hành để cài đặt và sử dụng .NET Framework cũng không kém phần quan trọng. Cài đặt .NET Framework trên các hệ điều hành Windows 2000, 2000 Server, XP, 2003 Server, Vista sẽ đơn giản và tiện dụng hơn trong khi lập trình. • Common Language Runtime Là thành phần "kết nối" giữa các phần khác trong .NET Framework với hệ điều hành. Common Language Runtime (CLR) giữ vai trò quản lý việc thi hành các ứng dụng viết bằng .NET trên Windows. CLR sẽ thông dịch các lời gọi từ chương trình cho Windows thi hành, đảm bảo ứng dụng không chiếm dụng và sử dụng tràn lan tài nguyên của hệ thống. Nó cũng không cho phép các lệnh "nguy hiểm" được thi hành. Các chức năng này được thực thi bởi các thành phần bên trong CLR như Class loader, Just In Time compiler, Garbage collector, Exception handler, COM marshaller, Security engine, Trong các phiên bản hệ điều hành Windows mới như XP.NET và Windows 2003, Win Vista CLR được gắn kèm với hệ điều hành. Điều này đảm bảo ứng dụng viết ra trên máy tính của Trang 3
  10. chúng ta sẽ chạy trên máy tính khác mà không cần cài đặt, các bước thực hiện chỉ đơn giản là một lệnh xcopy của DOS! • Bộ thƣ viện các lớp đối tƣợng Nếu phải giải nghĩa từ "Framework" trong thuật ngữ .NET Framework thì đây là lúc thích hợp nhất. Framework chính là một tập hợp hay thư viện các lớp đối tượng hỗ trợ người lập trình khi xây dựng ứng dụng. Có thể một số người trong chúng ta đã nghe qua về MFC và JFC. Microsoft Foundation Class là bộ thư viện mà lập trình viên Visual C++ sử dụng trong khi Java Foundation Class là bộ thư viện dành cho các lập trình viên Java. Giờ đây, có thể coi .NET Framework là bộ thư viện dành cho các lập trình viên .NET. Với hơn 5000 lớp đối tượng để gọi thực hiện đủ các loại dịch vụ từ hệ điều hành, chúng ta có thể bắt đầu xây dựng ứng dụng bằng Notepad.exe!!! Nhiều người lầm tưởng rằng các môi trường phát triển phần mềm như Visual Studio 98 hay Visual Studio.NET là tất cả những gì cần để viết chương trình. Thực ra, chúng là những phần mềm dùng làm "vỏ bọc" bên ngoài. Với chúng, chúng ta sẽ viết được các đoạn lệnh đủ các màu xanh, đỏ; lỗi cú pháp báo ngay khi đang gõ lệnh; thuộc tính của các đối tượng được đặt ngay trên cửa sổ properties, giao diện được thiết kế theo phong cách trực quan Như vậy, chúng ta có thể hình dung được tầm quan trọng của .NET Framework. Nếu không có cái cốt lõi .NET Framework, Visual Studio.NET cũng chỉ là cái vỏ bọc! Nhưng nếu không có Visual Studio.NET, công việc của lập trình viên .NET cũng lắm bước gian nan! o Base class library – thƣ viện các lớp cơ sở Đây là thư viện các lớp cơ bản nhất, được dùng trong khi lập trình hay bản thân những người xây dựng .NET Framework cũng phải dùng nó để xây dựng các lớp cao hơn. Ví dụ các lớp trong thư viện này là String, Integer, Exception, o ADO.NET và XML Bộ thư viện này gồm các lớp dùng để xử lý dữ liệu. ADO.NET thay thế ADO để trong việc thao tác với các dữ liệu thông thường. Các lớp đối tượng XML được cung cấp để bạn xử lý các dữ liệu theo định dạng mới: XML. Các ví dụ cho bộ thư viện này là SqlDataAdapter, SqlCommand, DataSet, XMLReader, XMLWriter, o ASP.NET Bộ thư viện các lớp đối tượng dùng trong việc xây dựng các ứng dụng Web. ASP.NET không phải là phiên bản mới của ASP 3.0. Ứng dụng web xây dựng bằng ASP.NET tận dụng được toàn bộ khả năng của .NET Framework. Bên cạnh đó là một "phong cách" lập trình mới mà Microsoft đặt cho nó một tên gọi rất kêu: code behind. Đây là cách mà lập trình viên xây dựng các ứng dụng Windows based thường sử dụng – giao diện và lệnh được tách riêng. Tuy nhiên, nếu bạn đã từng quen với việc lập trình ứng dụng web, đây đúng là một sự "đổi đời" vì bạn đã được giải phóng khỏi mớ lệnh HTML lộn xộn tới hoa cả mắt. Sự xuất hiện của ASP.NET làm cân xứng giữa quá trình xây dựng ứng dụng trên Windows và Web. ASP.NET cung cấp một bộ các Server Control để lập trình viên bắt sự kiện và xử lý dữ liệu của ứng dụng như đang làm việc với ứng dụng Windows. Nó cũng cho phép chúng ta chuyển một ứng dụng trước đây viết chỉ để chạy trên Windows thành một ứng dụng Web khá dễ dàng. Ví dụ cho các lớp trong thư viện này là WebControl, HTMLControl, o Web services Web services có thể hiểu khá sát nghĩa là các dịch vụ được cung cấp qua Web (hay Internet). Dịch vụ được coi là Web service không nhằm vào người dùng mà nhằm vào người xây dựng phần mềm. Trang 4
  11. Web service có thể dùng để cung cấp các dữ liệu hay một chức năng tính toán. Ví dụ, công ty du lịch của bạn đang sử dụng một hệ thống phần mềm để ghi nhận thông tin về khách du lịch đăng ký đi các tour. Để thực hiện việc đặt phòng khách sạn tại địa điểm du lịch, công ty cần biết thông tin về phòng trống tại các khách sạn. Khách sạn có thể cung cấp một Web service để cho biết thông tin về các phòng trống tại một thời điểm. Dựa vào đó, phần mềm của bạn sẽ biết rằng liệu có đủ chỗ để đặt phòng cho khách du lịch không? Nếu đủ, phần mềm lại có thể dùng một. Web service khác cung cấp chức năng đặt phòng để thuê khách sạn. Điểm lợi của Web service ở đây là bạn không cần một người làm việc liên lạc với khách sạn để hỏi thông tin phòng, sau đó, với đủ các thông tin về nhiều loại phòng người đó sẽ xác định loại phòng nào cần đặt, số lượng đặt bao nhiêu, đủ hay không đủ rồi lại liên lạc lại với khách sạn để đặt phòng. Đừng quên là khách sạn lúc này cũng cần có người để làm việc với nhân viên của bạn và chưa chắc họ có thể liên lạc thành công. Web service được cung cấp dựa vào ASP.NET và sự hỗ trợ từ phía hệ điều hành của Internet Information Server. o Window form Bộ thư viện về Window form gồm các lớp đối tượng dành cho việc xây dựng các ứng dụng Windows based. Việc xây dựng ứng dụng loại này vẫn được hỗ trợ tốt từ trước tới nay bởi các công cụ và ngôn ngữ lập trình của Microsoft. Giờ đây, ứng dụng chỉ chạy trên Windows sẽ có thể làm việc với ứng dụng Web dựa vào Web service. Ví dụ về các lớp trong thư viện này là: Form, UserControl, Phân nhóm các lớp đối tƣợng theo loại Một khái niệm không được thể hiện trong hình vẽ trên nhưng cần đề cập đến là Namespace. Đây là tên gọi một nhóm các lớp đối tượng phục vụ cho một mục đích nào đó. Chẳng hạn, các lớp đối tượng xử lý dữ liệu sẽ đặt trong một namespace tên là Data. Các lớp đối tượng dành cho việc vẽ hay hiển thị chữ đặt trong namespace tên là Drawing. Một namespace có thể là con của một namespace lớn hơn. Namespace lớn nhất trong .NET Framework là System. Hệ thống tên miền (Namespace) Lợi điểm của namespace là phân nhóm các lớp đối tượng, giúp người dùng dễ nhận biết và sử dụng. Ngoài ra, namespace tránh việc các lớp đối tượng có tên trùng với nhau Trang 5
  12. không sử dụng được. .NET Framework cho phép chúng ta tạo ra các lớp đối tượng và các namespace của riêng mình. Với hơn 5000 tên có sẵn, việc đặt trùng tên lớp của mình với một lớp đối tượng đã có là điều khó tránh khỏi. Namespace cho phép việc này xảy ra bằng cách sử dụng 1 tên đầy đủ để nói đến 1 lớp đối tượng. Ví dụ, nếu muốn dùng lớp WebControls, chúng ta có thể dùng tên tắt của nó là WebControls hay tên đầy đủ là: System.Web.UI.WebControls. Đặc điểm của bộ thư viện các đối tượng .NET Framework là sự trải rộng để hỗ trợ tất cả các ngôn ngữ lập trình .NET như chúng ta thấy ở hình vẽ trên. Điều này sẽ giúp những người mới bắt đầu ít bận tâm hơn trong việc lựa chọn ngôn ngữ lập trình cho mình vì tất cả các ngôn ngữ đều mạnh ngang nhau. Cũng bằng cách sử dụng các lớp đối tượng để xây dựng ứng dụng, .NET Framework buộc người lập trình phải sử dụng kỹ thuật lập trình hướng đối tượng (sẽ được nói tới trong các chương sau). II. Web Server Trong phần này giới thiệu về IIS (phần mềm Web Server của Microsot dành cho Windows), đồng thời hướng dẫn cài đặt, cấu hình và kiểm tra Web Server trên các hệ thống sử dụng Windows 2000,XP, Vista, Server 2003. 1. Internet Information Services (IIS) IIS có thể được sử dụng như 1 Web server, kết hợp với ASP, ASP.NET để xây dựng các ứng dụng Web tận dụng các điểm mạnh của Server-side Script, COM component, theo mô hình Client/Server. IIS có rất nhiều phiên bản, đầu tiên được phát hành rời trong bản Service pack của WinNT. • Các phiên bản Windows 2000 đã có tích hợp IIS 5.0. • Windows XP tích hợp IIS 5.5 • Windows XP .NET Server tích hợp IIS 6 hỗ trợ các tính năng dành cho .NET của ASP.NET và Web Service. • Windows Vista tích hợp IIS 7.0 2. Cài đặt Web Server a. Cài đặt Web Server trên Windows 2000/Windows XP Professional Windows 2000, Xp tích hợp sẵn IIS nhưng không tự động cài đặt do đó, bạn phải tự cài IIS nếu hệ thống chưa cài. • Bước 1. Chọn Control Panel | Add/Remove programs. • Bước 2. Add/Remove Windows Components. • Bước 3. Đánh dấu vào mục Internet Information Services (IIS). Trang 6
  13. • Bước 4. Chọn nút Next để cài đặt. Sau khi cài đặt IIS, thư mục InetPub tự động được tạo ra trong ổ C: và chứa thư mục con wwwroot. Có thể truy cập đến Website bằng cách: hoặc • Ghi chú: Để kiểm tra cài đặt: Khởi động trình duyệt truy cập địa chỉ : Kết quả thành công. b. Cài đặt Web Server trên Windows Vista • Bƣớc 1: Chọn Start Settings Control Panel • Bƣớc 2: Chọn Classic View Chọn Programs and features Trang 7
  14. Bước 3: Ch ọ n Turn Windows features on or off • Bƣớc 4: Đánh dấu vào mục Internet Information Services (IIS) Chọn Ok để cài đặt Trang 8
  15. Kiềm tra kết quả cài đặt: Khởi động trình duyệt nhập địa chỉ c. Cài đặt Web Server trên Windows Server 2003 Cài đặt Web Server trên Windows Server 2003 cũng tương tự như cài đặt Web Server trên Windows 2000. • Bước 1. Chọn Control Panel | Add/Remove programs. • Bước 2. Add/Remove Windows Components. • Bước 3. Đánh dấu vào Application Server. • Bước 4: Chọn Next để cài đặt 3. Cấu hình Internet Information Services Để cấu hình IIS, vào Control Panel Administrative Tools Internet Services Manager. Trên các hệ điều hành Windows 2000/XP, Vista Microsoft sử dụng công cụ Microsoft Management Console (MMC) để làm công cụ quản lý. a. Cấu hình IIS quy định trang chủ mặc định Trên Win 2000, XP o Start Settings Control Panel Administratrive tools Mở mục Internet Infomtic Services Trang 9
  16. o Click phải mục Default Website Properties Chọn trang Documents để quy định trang chủ mặc định VD: Default.Aspx Default.asp Index.asp Home.html Index.htm Cấu hình IIS trên Win Vista o Start Settings Control Panel Administratrive tools Mở mục IIS Manager o Click phả i mục Default Document b. Cấu hình quy định thƣ mục ảo – Virtual Directory: Trang 10
  17. Một Web Server có thể quản lý nhiều ứng dụng Web đồng thời. Ta có thể tổ chức một thư mục con trong wwwroot cho mỗi ứng dụng nhưng tố hơn bạn nên tạo ánh xạ (Virtual Directory) liên kết đến thư mục đó.Để tạo một virtual directory: • Trên Windows 2000, Xp Click phải: Default Website New/ Virtual Directory Next Next Nextt Khai báo nhãn cho thư mục ảo (Myweb) Khai báo thư mục vật lý (D:\MyWebsite) Xác lập quyền truy cập Next Finish • Trên Win Vista Click phải: Default Website Add Application (hoặc Virtual Directory) Khai báo nhãn (Alias) và chỉ định thư mục vật lý lưu trữ Website(Physical path) Trang 11
  18. Chạy thử ứng dụng để kiểm tra: • Hoặc từ cửa sổ IIS Manager: click phải trang cần xem (Default.aspx) Browse • Hoặc từ trình duyệt nhập: IV. Tạo ứng dụng đầu tiên 1. Khởi động MS Visual Studio .Net Chúng ta sẽ bắt đầu bằng việc làm quen với môi trường phát triển ứng dụng (IDE) của Visual Studio.NET 2005. Start Programs Microsoft Visual Studio 2005 Microsoft Visual Studio 2005 2. Tạo ứng dụng web Bước 1. Chọn từ thực đơn File New Website Trang 12
  19. Chọn các dạng ứng dụng tạo (ASP.Net Website) Vị trí lưu trữ (D:\Wellcom) Ngôn ngữ lập trình (C#) Chon Ok Kết quả: Cử a sổ Solution Explorer Trang Default.aspx (Design) • Trang Default.aspx (Source) Trang 13
  20. • Trang Default.aspx.cs 3. Bổ sung điều khiể n • Chọn trang Default.aspx Chuyển trang sang chế độ làm việc Design • Nhập một dòng văn bản: “Chào mừng các bạn đến vời ASP.Net” • Thêm 2 điều khiển Label từ thanh công cụ Toolbox vào trang, đặt tên lần lượt là : lbNgay, lbThoigian. • Chuyển sang trang code Defaulr.aspx.cs (Double click vào trang đang thiết kế) Nhập code cho sự kiện Page Load: Trang 14
  21. Lưu ý: Phải lưu tập tin với tùy chọn Save with Encoding nếu có sử dụng Font Unicode. 4. Thi hành ứng dụng o Kiểm lỗi trước khi chạy: Từ Menu Build Chọn Build Web Site o Chấp nhận bật chế độ debug cho Website o Chạy chương trình Bấm Ctrl + F5 : để chạy chương trình (không debug) và F5 để chạy debug. 5. Phân loại tập tin trong ASP.Net ASP.Net ASP Diễn giải Trang 15
  22. .asax .asa Tập tin global.asax trong ASP .Net thay thế cho tập tin global.asa của ASP, là tập tin quản lý các sự kiện của ứng dụng (application), session, và các sự kiện khi có các yêu cầu tới trang web. .ascx Các điều khiển do người dùng tự tạo được lưu trữ với phần mở rộng là ascx. .asmx Tập tin Web Service của ứng dụng ASP.Net .aspx .asp Phần mở rộng của trang ASP.Net .config Tập tin cấu hình ứng dụng theo định dạng XML. Web.config chứa hầu hết các cấu hình của ứng dụng .cs Tập tin mã nguồn viết theo ngôn ngữ C# .js .js Tập tin mã nguồn của Jscript .vb Tập tin mã nguồn viết theo ngôn ngữ VB.Net V. Làm quen với các thành phần giao diện trên VS .Net 1. Solution Explorer • Hiển thị cửa số Solution Explorer: Thực đơn View | Solution Explorer • Thao tác với cửa sổ Solution Explorer : Đây là cửa số quản lý các "tài nguyên" có trong ứng dụng. Thông qua cửa sổ này, chúng ta có thể: o Thực hiện các chức năng: sao chép, cắt, dán trên tập tin, thư mục như Windows Explorer. o Tổ chức thư mục quản lý ứng dụng: Sử dụng chức năng Add | New Folder từ thực đơn ngữ cảnh. o Thêm thành phần mới cho ứng dụng: Sử dụng chức năng Add | Add New Item từ thực đơn ngữ cảnh. Xuất hiện hộp thoại Add New Item. . Web Form: Thêm trang Web . Class: Thêm lớp đối tượng . Module Web Form: Thêm thư viện . Web User Control: Thêm điều khiển người dùng . Trang 16
  23. • Xác định trang web khởi động cho ứng dụng: Chọn trang cần khởi động Nhấp chuột phải (xuất hiện thực đơn ngữ cảnh) Chọn Set As Start Page. • Xác định Project khởi động (trong trường hợp Solution có nhiều Project): Chọn Set as StartUp Project từ thực đơn ngữ cảnh. 2. Property Window Hiển thị cửa số Properties Window: Thực đơn View | Properties Window. Thông qua cửa sổ thuộc tính, chúng ta có thể thiết lập thuộc tính cho trang web và các đối tượng có trong trang web. 3. Toolbox Hiển thị Toolbox: Thực đơn View Toolbox Trang 17
  24. 4. Document Outline Window Hiển thị cửa sổ Document Outline: Thực đơn View / Other Windows / Document Outline. Cửa sổ này hiển thị các thành phần của trang web theo tổ chức cây rất dễ quản lý và thao tác với các đối tượng có trong trang Web. Trang 18
  25. Bài 02: WEB SERVER CONTROL • Điều khiển chuẩn – Standard • Điều khiển kiểm tra dữ liệu Validation • Một số điều khiển khác • Đối tượng ViewState I. Điều khiển chuẩn – Standard Những lý do nên sử dụng ASP.Net Standard Web Control: • Đơn giản, tương tự như các điều khiển trên Windows Form. • Đồng nhất: Các điều khiển Web server có các thuộc tính giống nhau dễ tìm hiểu và sử dụng. • Hiệu quả: Các điều khiển Web Server tự động phát sinh ra các tag HTML theo từng loại Browser. Bảng liệt kê các thuộc tính chung của các Web control Thuộc tính Kiểu Ý nghĩa (ID) Chuỗi Qui định tên của điều khiển. Tên của điều khiển là duy nhất. AccessKey String Qui định ký tự để di chuyển nhanh đến điều khiển - ký tự xử lý phím nóng. Attributes AttributeCollection Tập hợp các thuộc tính của điều khiển HTML BackColor Color Qui định màu nền của điều khiển. BorderColor Color Qui định màu đường viền của điều khiển. BorderStyle BorderStyle Qui định kiểu đường viền của điều khiển. BorderWidth Unit Qui định độ rộng của đường viền. CssClass String Qui định hình thức hiển thị của điều khiển qua tên CSS. Enabled Boolean Qui định điều khiển có được hiển thị hay không. Giá trị mặc định của thuộc tính này là True – được phép hiển thị. Font FontInfo Qui định Font hiển thị cho điều khiển ForeColor Color Qui định màu chữ hiển thị trên điều khiển Trang 19
  26. Height Unit Qui định chiều cao của điều khiển ToolTip String Dòng chữ sẽ hiển thị khi rê chuột vào điều khiển. Width Unit Qui định độ rộng của điều khiển. 1. Label Label thường được sử dụng để hiển thị và trình bày nội dung trên trang web. Nội dung được hiển thị trong label được xác định thông qua thuộc tính Text. Thuộc tính Text có thể nhận và hiển thị nội dung với các tag HTML. Ví dụ: lblA.Text = "Đây là chuỗi văn bản thường"; lblB.Text = " Còn đây là chuỗi văn bản được in đậm "; 2. TextBox TextBox là điều khiển được dùng để nhập và hiển thị dữ liệu. TextBox thường được sử dụng nhiều với các ứng dụng trên windows form. Các thuộc tính: • Text: Nội dung chứa trong Textbox • TextMode: Qui định chức năng của Textbox, có các giá trị sau: o SingleLine: Hiển thị và nhập liệu 1 dòng văn bản o MultiLine: Hiển thị và nhập liệu nhiều dòng văn bản o Password: Hiển thị dấu * thay cho các ký tự có trong Textbox. • Rows: Trong trường hợp thuộc tính TextMode = MultiLine, thuộc tính Rows sẽ qui định số dòng văn bản được hiển thị. • Maxlength: Qui định số ký tự tối đa được nhập vào cho TextBox • Wrap: Thuộc tính này qui định việc hiển thị của văn bản có được phép tự động xuống dòng khi kích thước ngang của của điều khiển không đủ để hiển thị dòng nội dung văn bản. Giá trị mặc định của thuộc tính này là True - tự động xuống dòng. Ví dụ: 3. Image Điều khiển này được dùng để hiển thị hình ảnh lên trang Web. Các thuộc tính: • ImageURL: Đường dẫn đến tập tin hình ảnh cần hiển thị. • AlternateText: Chuỗi văn bản sẽ hiển thị khi tập tin được thiết lập trong thuộc tính ImageURL không tồn tại. • ImageAlign: Vị trí hiển thị giữa hình và nội dung văn bản. o NotSet Trang 20
  27. o Left o Middle o TextTop o Right 4. Button, ImageButton, LinkButton • Các điều khiển Button, ImageButton, LinkButton mặc định đều là các nút Submit Button, mỗi khi được nhấn vào sẽ PostBack về Server. • Khi chúng ta thiết lập giá tri thuộc tính CommandName cho các điều khiển này, chúng ta gọi tên chung cho các điều khiển này là Command Button. Các thuộc tính chung của Button, ImageButton, LinkButton Thuộc tính Ý nghĩa Text Chuỗi văn bản hiển thị trên điều khiển. CommandName Tên lệnh. Được sử dụng trong sự kiện Command. • Ngoài những thuộc tính trên, điều khiển ImageButton còn có các thuộc tính ImageURL, ImageAlign và AlternateText như điều khiển Image. Ví dụ: Tạo Website Tinhtoan gồm các điều khiển: Label, Textbox, Button Xử lý sự kiện: protected void btTinhtien_Click(object sender, EventArgs e) Trang 21
  28. { int soluong=int.Parse(txtSoluong.Text ); int dongia=int.Parse(txtDongia.Text ); int Thanhtien=soluong * dongia; txtThanhtien.Text = Thanhtien.ToString(); } Khi thi hành ứng dụng 5. HyperLink Điều khiển này được sử dụng để tạo ra các liên kết siêu văn bản. Các thuộc tính: • ImageURL: Qui định hình hiển thị trên điều khiển. • Text: Chuỗi văn bản sẽ được hiển thị trên điều khiển. Trong trường hợp cả 2 thuộc tính ImageURL và Text được thiết lập, thuộc tính ImageURL được ưu tiên, thuộc tính Text sẽ được hiển thị như Tooltip. • NavigateUrl: Đường dẫn cần liên kết đến. • Target: Xác định cửa sổ sẽ hiển thị cho mối liên kết o _blank: Hiển thị trang liên kết ở một cửa sổ mới. o _self: Hiển thị trang liên kết tại chính cửa sổ chứa liên kết đó. o _parent: Hiển thị trang liên kết ở frame cha. Ví dụ: hplASPNet.Text = "Trang chủ ASP.Net"; hplASPNet.ImageUrl = "~/Pictures/logoaspnet.jpg"; hplASPNet.NavigateUrl =" "; hplASPNet.Target = "_blank"; Kết quả hiển trị trên trang Web: Ví dụ: Tạo Website Lienket gồm 3 điều khiển Hyperlink 6. Listbox và DropdownList ListBox và DropdownList là điều khiển hiển thị danh sách lựa chọn mà người dùng có thể chọn một hoặc nhiều (chỉ dành cho ListBox). Các mục lựa chọn có thể được thêm vào danh sách thông qua lệnh hoặc ở cửa sổ thuộc tính (Property Windows). Các thuộc tính: Trang 22
  29. • AutoPostBack: Thuộc tính này qui định điều khiển có được phép tự động PostBack về Server khi chỉ số của mục chọn bị thay đổi. Giá trị mặc định của thuộc tính này là False không tự động Postback. • Items : Đây là tập hợp chứa các mục chọn của điều khiển. Ta có thể thêm vào mục chọn vào thời điểm thiết kế thông qua cửa sổ ListItem Collection Editor, hoặc thông qua lệnh. • Rows: Qui định chiều cao của ListBox theo số dòng hiển thị. • SelectionMode: Thuộc tính này xác định cách thức chọn các mục trong ListBox. SelectionMode chỉ được phép thay đổi trong quá trình thiết kế, vào lúc thực thi chương trình, thuộc tính này chỉ đọc. o Single: Chỉ được chọn một mục có trong danh sách (mặc định). o Multiple: Cho phép chọn nhiều lựa chọn. Tìm hiểu về tập hợp Items • Add: Thêm mục mới vào cuối danh sách, sử dụng phương thức Items.Add Items.Add( ); • Insert: Thêm mục mới vào danh sách tại một vị trí nào đó, sử dụng phương thức Items.Insert Items.Insert( , ); • Count: Trả về số mục (Item) có trong danh sách. Items.Count; • Remove: Xóa đối tượng Item tại ra khỏi danh sách. Items.Remove( ); Trong trường hợp các đối tượng Item là kiểu chuỗi, ta truyền vào một chuỗi để xóa. Nếu có nhiều giá trị giống nhau trong danh sách, chỉ có mục chọn đầu tiên bị xóa. • RemoveAt: Xóa một item tại vị trí index ra khỏi danh sách. Items.RemoveAt( ); o Clear: Phương thức Clear của tập hợp Items được dùng để xóa tất cả những Item có trong danh sách. Cú pháp Items.Clear(); Xử lý mục chọn Các thuộc tính sau sẽ giúp bạn xác định chỉ số, giá trị của mục đang được chọn. Trong trường hợp điều khiển cho phép chọn nhiều, ta duyệt qua các Item trong tập hợp Items, o Sử dụng thuộc tính Selected của đối tượng Items[i] để kiểm tra xem mục thứ i đó có được chọn hay không. • SelectedIndex: Cho biết chỉ số của mục được chọn. Trong trường hợp chọn nhiều mục, SelectedIndex sẽ trả về chỉ số mục chọn đầu tiên. • SelectedItem: Cho biết mục được chọn. Trong trường hợp chọn nhiều mục, SelectedItem sẽ trả về mục chọn đầu tiên. • SelectedValue: Cho biết giá trị của mục được chọn. Trong trường hợp chọn nhiều mục, SelectedValue sẽ trả về giá trị mục chọn đầu tiên. Ví dụ: Tạo Website Dulich gồm 1 listbox, 2 label , 1 Button trong đó điều khiển Listbox là điều Trang 23
  30. khiển danh sách lstKhu_dl: SelectionMode=Multiple ; Rows=4 Khi thiết kế: Xử lý sự kiện: protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { lstDiadanh.Items.Add("Vịnh Hạ Long"); lstDiadanh.Items.Add("Phan Thiết - Mũi Né"); lstDiadanh.Items.Add("Nha Trang"); lstDiadanh.Items.Add("Đà Lạt"); lstDiadanh.Items.Add("Phú Quốc"); lstDiadanh.Items.Add("Huế - Hội An"); int n = lstDiadanh.Items.Count; lbSoDD.Text = n.ToString(); } } protected void btChon_Click(object sender, EventArgs e) { lbDiadanh.Text = ""; for (int i = 0; i " + lstDiadanh.Items[i].Value; } /* Hoặc foreach (ListItem item in lstDiadanh.Items ) { if (item.Selected) lbDiadanh.Text += " " + item.Value ; } */ } Khi thi hành: 7. Checkbox, RadioButtonCác thuộc tính • Checked: Cho biết trạng thái của mục chọn - có được chọn hay không TextAlign: Qui định vị trí hiển thị của điều khiển so với chuỗi văn bản. Trang 24
  31. • AutoPostBack: Thuộc tính này qui định điều khiển có được phép tự động PostBack về Server khi các mục chọn của điều khiển bị thay đổi. Giá trị mặc định của thuộc tính này là False - không tự động Postback. • GroupName (RadioButton): Tên nhóm. Thuộc tính này được sử dụng để nhóm các điều khiển RadioButton lại thành 1 nhóm. Ví dụ: Nhóm các RadioButton Giới tính, Thu nhập, Nhóm Checkbox Ngoại ngữ Danh sách các điều khiển 8. CheckBoxList, RadioButtonList Hai điều khiển này được dùng để tạo ra một nhóm các CheckBox/Radio Button. Do đây là điều khiển danh sách nên nó cũng có thuộc tính Items chứa tập hợp các mục chọn như ListBox/DropDownList. Các thao tác trên tập hợp Items, xử lý mục chọn cũng tương tự như ListBox/DropDownList. Tạo mới: Kéo thả RadioButtonList (Hoặc CheckbocList) vào Form Chọn Edit Items Trang 25
  32. b. Các thuộc tính • RepeatColumns: Qui định số cột hiển thị. • RepeatDirection: Qui định hình thức hiển thị o Vertical: Theo chiều dọc o Horizontal: Theo chiều ngang • AutoPostBack: Thuộc tính này qui định điều khiển có được phép tự động PostBack về Server khi các mục chọn của điều khiển bị thay đổi. Giá trị mặc định của thuộc tính này là False - không tự động Postback. c. Ví dụ Xử lý sự kiện: Private Sub rblThu_nhap_SelectedIndexChanged( ) lblThu_nhap.Text = "Bạn chọn thu nhập: " + rblThu_nhap.SelectedItem.Text; End Sub Khi thi hành: Ví dụ: Bổ sung thêm vào Website Dulich 1 trang Thongtincanhan gồm: 1 Textbox, 2 RadioButton giới tính, 2 Checkbox ngọai ngữ, 3 radioButton thu nhập listbox, 2 label , 1 RadioButtonList Trình độ, 1 Button Đăng ký. Xử lý sự kiện: protected void Button1_Click(object sender, EventArgs e) { string ten="",gt="", ngoaingu="", thunhap="", trinhdo=""; ten = txtTen.Text; if (rdtNu.Checked == true) gt = "Nữ"; else gt = "Nam"; if (chkAnh_van.Checked == true) ngoaingu = " Tiếng anh "; if (ChkPhap_van.Checked == true) ngoaingu = ngoaingu + " Tiếng pháp "; if (rdtThu_nhapA.Checked == true) thunhap = " 1 triệu "; else if (rdtThu_nhapB.Checked == true) thunhap = " từ 1 đến 3 triệu"; else Trang 26
  33. thunhap = " trên 3 triệu "; trinhdo = rdblistTrinhdo.SelectedItem.Value; lbThongtin.Text = "THÔNG TIN VỀ BẠN Tên: " + ten + " Giới tính:" + gt + " Ngoại ngữ :" + ngoaingu + " Mức thu nhập:" + thunhap + " Trình độ:" + trinhdo ; } Khi thi hành: II. Điều khiển kiểm tra dữ liệu Trong phần này chúng ta sẽ tìm hiểu về các điều khiển được dùng để kiểm tra dữ liệu. Như các bạn đã biết, mỗi khi PostBack về Server, trang Web luôn kiểm tra tính hợp lệ dữ liệu (nếu có yêu cầu khi thiết kế). Nếu dữ liệu không hợp lệ (bỏ trống, vi phạm miền giá trị, mật khẩu nhập lại không đúng, ), trang web sẽ không thể PostBack về Server. Trang 27
  34. i Ví dụ: Minh họa thuộc tính Display: Tại ô nhập lại mật khẩu, ta có 2 điều khiển kiểm tra dữ liệu: một điều khiển kiểm tra không được phép rỗng (rfvNhap_lai), một điều khiển kiểm tra xem nhập lại mật khẩu có giống với mật khẩu đã nhập ở trên hay không. rfvNhap_lai.Display = Static rfvNhap_lai.Display = Dynamic 1. Điều khiển Required Field Validator Điều khiển này được dùng để kiểm tra giá trị trong điều khiển phải được nhập. Sử dụng điều khiển này để kiểm tra ràng buộc dữ liệu khác rỗng (bắt buộc nhập). Thuộc tính • InitialValue: Giá trị khởi động. Giá trị bạn nhập vào phải khác với giá trị của thuộc tính này. Giá trị mặc định của thuộc tính này là chuỗi rỗng. Trang 28
  35. 2. Điều khiển Compare Validator Điều khiển này được dùng để so sánh giá trị của một điều khiển với giá trị của một điều khiển khác hoặc một giá trị được xác định trước. Thông qua thuộc tính Operator, chúng ta có thể thực hiện các phép so sánh như: =, , >=, o GreaterTha nEqual: >= o LessThan: o DataType Check: Kiểm tra kiểu dữ liệu • Type: Qui định kiểu dữ liệu để kiểm tra hoặc so sánh. o String o Integer o Double o Date o Currency • ValueToCompare: Giá trị cần so sánh. Trong trường hợp bạn xác định giá trị của cả 2 thuộc tính ControlToCompare và ValueToCompare thì giá trị của điều khiển được qui định bởi thuộc tính ControlToCompare được ưu tiên dùng để kiểm tra. 3. Điều khiển Range Validator Điều khiển này được dùng để kiểm tra giá trị trong điều khiển phải nằm trong đoạn [minmax] Sử dụng điều khiển này để kiểm tra ràng buộc miền giá trị của dữ liệu. Lƣu ý: Trong trường hợp không nhập dữ liệu, điều khiển sẽ không thực hiện kiểm tra vi phạm. Các thuộc tính Trang 29
  36. • MinimumValue: Giá trị nhỏ nhất. • MaximumValue: Giá trị lớn nhất. • Type: Xác định kiểu để kiểm tra dữ liệu. Có thể thực hiện kiểm tra trên các kiểu dữ liệu sau: o String o Integer o Double o Date o Currency 4. Điều khiển Regular Expression Validator Điều khiển này được dùng để kiểm tra giá trị của điều khiển phải theo mẫu được qui định trước: địa chỉ email, số điện thoại, mã vùng, số chứng minh thư, Lƣu ý: Trong trường hợp không nhập dữ liệu, điều khiển sẽ không thực hiện kiểm tra vi phạm. Thuộc tính: • ValidationExpression: Qui định mẫu kiểm tra dữ liệu. Bảng mô tả các ký hiệu thường sử dụng trong Validation Expression 5. Điều khiển Custom Validator Điều khiển này cho phép bạn tự viết hàm xử lý kiểm tra lỗi. Sự kiện Trang 30
  37. • ServerValidate: Đặt các xử lý kiểm tra dữ liệu trong sự kiện này. Việc kiểm tra này được thực hiện ở Server. Ví dụ: Xử lý kiểm tra dữ liệu nhập tại điều khiển txtSoA có phải là số chẵn hay không. 6. Điều khiển Validation Summary Điều khiển này được dùng để hiển thị ra bảng lỗi - tất cả các lỗi hiện có trên trang Web. Nếu điều khiển nào có dữ liệu không hợp lệ, chuỗi thông báo lỗi - giá trị thuộc tính ErrorMessage của Validation Control sẽ được hiển thị. Nếu giá trị của thuộc tính ErrorMessage không được xác định, thông báo lỗi đó sẽ không được xuất hiện trong bảng lỗi. Các thuộc tính • HeaderText: Dòng tiêu đề của thông báo lỗi • ShowMessageBox: Qui định bảng thông báo lỗi có được phép hiển thị như cửa sổ MessageBox hay không. Giá trị mặc định của thuộc tính này là False - không hiển thị. • ShowSummary: Qui định bảng thông báo lỗi có được phép hiển thị hay không. Giá trị mặc định của thuộc tính này là True - được phép hiển thị. Ví dụ: Tạo Website Dangkythanhvien Sử dụng các điều khiển ValidateControl. Trong ví dụ dưới đây, chúng ta thực hiện kiểm tra dữ liệu nhập trên các điều khiển có trong hồ sơ đăng ký khách hàng. Trang 31
  38. Thuộc tính Text của các điều khiển kiểm tra dữ liệu đều là: (*) Xử lý sự kiện: Private Sub butDang_ky_Click( ) lblThong_bao.Text = "Đăng ký thành công"; End Sub Các thông báo lỗi xuất hiện trên màn hình nhập liệu khi dữ liệu nhập không hợp lệ. Trang 32
  39. Các thông báo lỗi xuất hiện qua hộp thoại khi dữ liệu nhập không hợp lệ: Nếu tất cả đều hợp lệ III. Một số điều khiển khác 1. Điều khiển Literal Tương tự như điều khiển Label, điều khiển Literal cũng được sử dụng để hiển thị chuỗi văn bản trên trang Web. Nếu muốn hiển thị một chuỗi văn bản trên trang Web, chúng ta có thể đánh nội dung trực tiếp vào trang Web mà không cần phải sử dụng điều khiển. Chỉ sử dụng các điều khiển như Label, Literal để hiển thị khi cần thay đổi nội dung hiển thị ở phía server. Trang 33
  40. Điểm khác biệt chính giữa Label và Literal là khi hiển thị nội dung lên trang web (lúc thi hành), điều khiển Literal không tạo thêm một tag Html nào cả, còn Label sẽ tạo ra một tag span (được sử dụng để lập trình ở phía client). Ví dụ: Khi thiết kế. Khi thi hành Lệnh xử lý: protected void Page_Load(object sender, EventArgs e) { Label1.Text=" Đây là chuỗi ký tự trong label "; Literal1.Text = " Đây là chuỗi ký tự trong Literial "; } Chọn chức năng từ thực đơn View | Source trên Browser: Đây là chuỗi ký tự trong label Đây là chuỗi ký tự trong Literial 2. Điều khiển AdRotator Điều khiển AdRotator được dùng để tạo ra các banner quảng cáo cho trang web, nó tự động thay đổi các hình ảnh (đã được thiết lập trước) mỗi khi có yêu cầu, PostBack về server. a. Thuộc tính • AdvertisementFile: Tên tập tin dữ liệu (dưới dạng xml) cho điều khiển. Dưới đây là cú pháp của tập tin Advertisement (*.xml) Đường dẫn đến tập tin hình ảnh Đường dẫn đến liên kết Chuỗi văn bản được hiển thị như Tooltip Từ khóa dùng để lọc hình ảnh Tần suất hiển thị của hình ảnh Lƣu ý: Phải nhập đúng các giá trị trong tag như mẫu trên. Các giá trị trong tag có phân biệt chữ Hoa chữ thường. Trong đó • ImageUrl: Đường dẫn đến một tập tin hình ảnh • NavigateUrl: Đường dẫn đến trang web sẽ được liên kết đến khi người dùng nhấn vào hình ảnh đang hiển thị. Trang 34
  41. • AlternateText: Giá trị này sẽ được hiển thị nếu như đường dẫn đến tập tin hình ảnh (qua thuộc tính NavigateUrl) không tồn tại. Đối với một số trình duyệt, tham số này được hiển thị như ToolTip của hình quảng cáo. • Keyword: Được dùng để phân loại các quảng cáo. Thông qua giá trị này, ta có thể lọc các quảng cáo theo một điều kiện nào đó. • Impressions: Tham số này quyết định tầng suất hiển thị của hình ảnh. Giá trị này càng lớn, khả năng hiển thị càng nhiều. • KeywordFilter: Được dùng để chọn lọc và hiển thị những hình quảng cáo có giá trị của tham số Keyword = giá trị của tham số này. Giá trị của tham số này mặc định không được thiết lập Hiển thị tất cả những hình có trong tập tin XML. Trong trường hợp nếu không có hình nào có giá trị Keyword bằng giá trị của thuộc tính này, sẽ không có hình nào được hiển thị. • Target: Qui định cửa sổ hiển thị trang liên kết • _blank: Trang liên kết sẽ được mở ở một cửa sổ mới. • _self: Trang liên kết sẽ được mở ở chính cửa sổ chứa điều khiển. • _parent: Trang liên kết sẽ được mở ở cửa sổ cha. b. Sự kiện AdCreated: Xảy ra khi điều khiển tạo ra các quảng cáo. Ví dụ: Tạo Website Quangcao (Tạo Quảng cáo sử dụng điều khiển AdRotator) Bước 1. Thiết kế giao diện Bước 2. Tạo tập tin dữ liệu: Quangcao.xml o Sử dụng chức năng Add New Item từ thực đơn ngữ cảnh o Chọn XML File trong hộp thoại Add New Item o Nhập vào cú pháp qui định cho tập tin Quangcao.xml (theo cú pháp của tập tin Advertisement) Trang 35
  42. Pictures\Baihatviet.gif Web Nhạc bài hát việt Music 10 o Chuyển màn hình qua trang Data, nhập liệu trực tiếp trên màn hình này Click phải màn hình đang code chọn View Data Grid Nhập thêm các liên kết quảng cáo sau: Bước 3. Thiết lập thuộc tính cho điều khiển adQuangcao o AdvertisementFile: Quangcao.xml o Target: _blank (Khi nhấn vào sẽ hiển thị liên kết ở cửa sổ mới.) o KeywordFilter: Không thiết lập (Hiển thị tất cả các hình ảnh) Bước 4. Thi hành ứng dụng 3. Điều khiển Calendar Một điều chắc chắn rằng điều khiển Calendar đã quá quen thuộc với các bạn lập trình ứng dụng trên windows, nó có giao diện trực quan, vì vậy, người dùng có thể chọn ngày dễ dàng. a. Thuộc tính • DayHeaderStyle: Qui định hình thức hiển thị tiêu đề của các ngày trong tuần DayStyle: Qui định hình thức hiển thị của các ngày trong điều khiển. • NextPrevStyle: Qui định hình thức hiển thị của tháng trước/sau của tháng đang được chọn. Trang 36
  43. • SeleltedDayStyle: Qui định hình thức hiển thị của ngày đang được chọn. • SeleltedDate: Giá trị ngày được chọn trên điều khiển • TitleStyle: Qui định hình thức hiển thị dòng tiêu đề của tháng được chọn • TodayDayStyle: Qui định hình thức hiển thị của ngày hiện hành (trên server). • WeekendDayStyle: Qui định hình thức hiển thị của các ngày cuối tuần (thứ 7, chủ nhật) • OtherMonthDayStyle: Qui định hình thức hiển thị của các ngày không nằm trong tháng hiện hành. b. Sự kiện • SelectionChanged: Sự kiện này xảy ra khi bạn chọn một ngày khác với giá trị ngày đang được chọn hiện hành • VisibleMonthChanged: Xự kiện này xảy ra khi bạn chọn tháng khác với tháng hiện hành Ví dụ: Tạo trang Calendard Bước 1: Tạo Calendard vào trang Bước 2: Chọn Auto Format (Chọn mẫu định dạng) Khi thiết kế Xử lý sự kiện: protected void Page_Load(object sender, EventArgs e) { lbNgay.Text = "Hôm nay ngày " + DateTime.Today.ToString ("dd/MM/yyyy"); } Trang 37
  44. protected void Calendar1_SelectionChanged1(object sender, EventArgs e) { lbThongbao.Text ="Bạn đang chọn " + Calendar1.SelectedDate.ToString("dd/MM/yyyy"); } Khi thi hành 4. Điều khiển File Upload. Điều khiển FileUpload cho phép người sử dụng Upload file từ chính ứng dụng Web của mình. File sau khi Upload có thể lưu trữ ở 1 nơi nào đó có thể là trên ổ cứng hay trong Database. Điều khiển FileUpload hỗ trợ các thuộc tính sau: Thuộc tính Ý nghĩa Enable Cho phép bạn vô hiệu hoá điều khiển FileUpload. FileBytes Cho phép lấy nội dung file đã được upload như một mảng Byte. FileContent Cho phép lấy nội dung của file đã được upload theo dòng dữ liệu FileName Lấy tên file được Upload HasFile Trả về giá trị đúng khi File được Upload Điều khiển FileUpload hỗ trợ các phương thức o Focus: Enables you to shift the form focus to the FileUpload control. o SaveAs: Cho phép bạn lưu file được upload lên hệ thống. Thuộc tính PostedFile của điều khiển FileUpload cho phép lấy thông tin từ File upload được bao bọc trong đối tượng HttpPostedFile. đối tượng này sẽ đưa thêm thông tin về Upload file. Lớp HttpPostedFile gồm các thuộc tính sau: o ContentLength: Lấy về kích thước của File Upload tính theo byte o ContentType: Lấy kiểu MIME của File Upload o FileName: Cho phép lấy tên của file được upload. o InputStream: Enables you to retrieve the uploaded file as a stream. Lớp HttpPostedFile chỉ hỗ trợ phương thức o SaveAs: Cho phép bạn lưu file được upload lên hệ thống. Trang 38
  45. Ví dụ: Trong ví dụ sau, chúng ta sẽ thực hiện Upload tập tin lên server, cụ thể hơn, tập tin vừa Upload sẽ được lưu trong thư mục Upload. Màn hình ở chế độ thiết kế Xử lý sự kiện: protected void Button1_Click(object sender, EventArgs e) { string sTenfile ; //Tách lấy tên tập tin sTenfile = FileUpload1.FileName; //Thực hiện chép tập tin lên thư mục Upload FileUpload1.SaveAs(MapPath("~/Upload/" + sTenfile)); lbThongbao.Text = "Đã upload thành công" ; } Khi thi hành: Nếu thành công 5. Điều khiển Panel và PlaceHolder Hai điều khiển Panel và PlaceHolder được sử dùng để chứa các điều khiển khác. Thuộc tính thường dùng của 2 điều khiển này là Visible. Nếu giá trị của thuộc tính này = True, các điều khiển chứa bên trong sẽ được hiển thị, ngược lại (Visible = False), không có điều khiển nào chứa bên trong được hiển thị. Tuy nhiên, điều khiển Panel cho phép chúng ta kéo những điều khiển vào bên trong nó lúc thiết kế, còn điều khiển PlaceHolder thì không. Các thuộc tính: • DefaultButton: Cho phép bạn định nghĩa một button mặc định trong panel mà button mặc định này sẽ được thực hiện khi bạn nhấn phím Enter. • Direction: Cho phép bạn gán hoặc thiết đặt hướng hiển thị nội dung được đưa ra trong panel, có thể là các giá trị:NotSet, LeftToRight, and RightToLeft. • GroupingText: Cho phép bạn trình bày Panel như 1 Fieldset với một chú giải riêng biệt. • HorizontalAlign: Cho phép bạn chỉ ra hướng ngang thể hiện nội dung của panel và nó có thẻ là các giá trị: Center, Justify, Left, NotSet, and Right. Trang 39
  46. • ScrollBars: Cho phép bạn hiển thị scrollbars khi bạn cố định chiều cao hoặc chiều rộng của panel và nội dung trong panel vượt quá độ rộng hoặc độ cao đó, nó có thể là các giá trị: Auto, Both, Horizontal, None, and Vertical. Ví dụ: Tao trang sử dụng Panel gồm: 1 panelpage chứa 1 panelsothich va 1 panel nghenghiep, trong panel sothich có vài checkbox, trong panel nghề nghệp hiện thị 100 nghề (Nghề 1, Nghề 2, . . .) được điền vào khi trang được load. Thêm vào panelpage 2 check box: chkSothich và chkNghenghiep. Khi trang hiện thị người dùng đánh check hoặc bỏ check vào checkbox nào thì panel tương ứng sẽ hiện hoặc ẩn. Thiết kế: Xử lý sự kiện: protected void Page_Load(object sender, EventArgs e) { for (int i = 1; i < 100; i++) { buletnghenghiep.Items.Add("Nghề "+i.ToString()); } } protected void chkhtsothich_CheckedChanged(. . . .) { if (chksothich.Checked == true) panelsothich.Visible = true; else panelsothich.Visible = false; } protected void chkhtnghenghiep_CheckedChanged(. . . ) { if (chknghenghiep.Checked == true) panelnghenghiep.Visible = true; else panelnghenghiep.Visible = false; } Thi hành: Trang 40
  47. 6. Điều khiển hiển thị các trang – MultiView Điều khiển MultiView cho phép bạn ẩn hoặc hiện các phần khác nhau của trang Web, điều khiển này tiện ích khi bạn tạo một TabPage. Nó thực sự tiện ích khi bạn muốn chia 1 trang web có độ dài lớn thành các phần để hiển thị. Điều khiển MultiView chứa đựng 1 hoặc nhiều điều khiển View, bạn sử dụng Multiview để lựa chọn các điều khiển View để trình bày. Điều khiển MultiView hỗ trợ các thuộc tính. • ActiveViewIndex: Lựa chọn điều khiển View được đưa ra hiển thị bằng chỉ số Index • Views: Cho phép bạn lấy về tập hợp các điều khiển View chứa đựng trong điều khiển MultiView. Điều khiển MultiView hỗ trợ hai phương thức. • GetActiveView: Cho phép lấy về thông tin của điều khiển View được lựa chọn. • SetActiveView: cho phép bạn thiết lập điều khiển View được hiên thị. Và MultiView hỗ trợ sự kiện sau: • ActiveViewChanged: Xảy ra khi điều khiển View được lựa chọn Ví dụ: Tạo 1 website MultiView: Sử dụng MultiView kết hợp với điều khiển Menu để tạo một TabPage Thiết kế • Trên trang thiết kế tạo: 1 Multiview1 bên trong gồm 3 View (View1 View2, View3) • Tạo Control Menu1 từ nhóm Control Navigation : Gồm 3 Tab (Tab1, Tab2, Tab3) o Tạo Control Menu vào Form Trang 41
  48. o Chọ n Edit Menu Item Lần lượt khái báo các nhãn (Text) là: Tab 1, Tab 2, Tab 3 và các giá trị (Value) tương ứng là: 0 , 1, 2 Thuộc tính Orientation: Horizaltal (Menu hướng ngang) o Bổ sung nội dung vào các view tương ứng Xử lý sự kiện void Menu1_MenuItemClick(object sender, MenuEventArgs e){ int index = int.Parse(e.Item.Value); MultiView1.ActiveViewIndex = index; } void Page_Load(object sender, EventArgs e){ if (!IsPostBack){ MultiView1.ActiveViewIndex = 0; Trang 42
  49. } } Thi hành: III. Đối Tƣợng View State Đối tượng ViewState được cung cấp để lưu lại những thông tin của trang web sau khi web server gởi kết quả về cho Client. Mặc định, các trang web khi được tạo sẽ cho phép sử dụng đối tượng ViewState thông qua thuộc tính EnableViewState (của trang web) = True. Gán giá trị cho ViewState: ViewState("Tên trạng thái") = ; Nhận giá trị từ đối tƣợng ViewState: = ViewState("Tên trạng thái"); Ví dụ: Xử lý sự kiện: protected void btDem_Click(object sender, EventArgs e) { lbThongbao.Text = Convert.ToString(int.Parse(lbThongbao.Text)+1); } Về bản chất, các giá trị trong đối tượng ViewState được lưu trong một điều khiển hidden và các giá trị này đã được mã hóa. Đối tượng ViewState giúp chúng ta giảm bớt công sức trong việc lưu trữ và truy xuất các thông tin mà không phải sử dụng nhiều điều khiển hidden. Chọn chức năng View | Source từ browser Trang 43
  50. IV. Thiết kế Website với MasterPage MasterPage là cách để thiết kế layout chung cho website. Ví dụ website của bạn có layout gồm 5 phần banner, footer, left, right Và content(phần chứa nội dung hiển thị cho các tin). Ta thấy rằng trên trang web có các phần có cách trình bày không thay đổi trong quá trình duyệt tin. banner, footer, left, right: bạn có thể để các phần này vào một MasterPage và tất các trang web trong website của bạn sẽ áp dụng layout này thông qua contentpage Tạo MasterPage Tạo MasterPage giống với tạo các trang aspx bình thường nhưng trên hộp Add New Item bạn chọn MasterPage bạn thấy dưới ô đặt tên phần mở rộng của nó sẽ là Master. Bạn có thể tạo nhiều MasterPage cho ứng dụng web của mình. Xóa Place Holder hiện có và dùng table thiết kế layout như sau: Trang 44
  51. • Tạo phần banner (Phần trên) • Tạo phần Menu (Cột trái) • Tạo phần quảng cáo (Cột phải) • Tạo phần footer (Phần dưới) • Tạo phần nội dung (Giữa): Đặt ContetPalceHolder Sử dụng trang Masterpage để thiết kế các trang Tạo mới trang web Default.aspx và trang Tintuc.aspx Trang 45
  52. Điều chỉnh MasterPage Khi có bất kỳ sự điều chỉnh nào trên trang Masterpage thì các trang được tạo từ trang Masterpage sẽ tự cập nhật. Ví dụ: Bổ sung vào phần trái của trang Masterpage 2 nhãn liên kết (Hyperlink) mơ 2 trang tương ứng đã tạo (Default.aspx và Tintuc.aspx) Trang 46
  53. Kết quả khi thi hành Trang 47
  54. Trang 48
  55. Bài 3. KẾT NỐI CƠ SỞ DỮ LIỆU TRONG ASP.NET • Sử dụng các thành phần kết nối CSDL như : SQLDataSource, Access Data Source, XML Data Source, . . . • Cách truyền tham số vào các điều khiển I. SQL DATA SOURCE 1. Giới thiệu Điều khiển SqlDataSource dung để kết nối CSDL nếu dữ liệu của ứng dụng được lưu trữ trong các hệ quản trị CSDL như: SQLServer, Ocracle Server, . . . Chọn đối tượng CSDL như Table, View hay câu lệnh truy vấn SQL và có thể khai báo điều kiện lọc dữ liệu (Where) với nhiều cách như: giá trị định sẳn, đối tượng Session, Request.form, Request.QueryString . . . 2. Kết nối và trình bày CSDL a. Tạo kết nối Tạo trang aspx và kéo điều khiển SQLDataSource từ ngăn data trên thanh Tollbox Chọ n tiế p vào Conigure Data Source Nếu trước đó đã có tạo kết nối CSDL thì chọn vào Combobox để chọn CSDL đã kết nối. Để tạo mới kết nối CSDL thì chọn New Connection Tạ o kế t nố i CSDL mớ i Trang 49
  56. Khai báo các thông số cho SQLServer và chọn CSDL cần kết nối Kiể m tra kế t quả kế t nố i . Chọn Next . Chọn Next . Xác định nguồn dữ liệu từ Table, Quyery hay câu lệnh truy vấn có thể chỉ định điều kiện lọc dữ liệu và sắp xếp. Trang 50
  57. Chỉ định các cột dữ liệu Khai báo điều kiệ n mệ nh đề Where (Nế u có) Khai báo sắ p xế p (Nế u cầ n) Chọn Test Query để kiểm tra kết quả nguồn dữ liệu. Chọn Finish để hòan thành Trang 51
  58. Phần mã của giao tiếp này có được như sau: " SelectCommand="SELECT [MaTG], [TenTG], [DiachiTG], [DienthoaiTG] FROM [TACGIA] ORDER BY [TenTG]"> b. Trình bày dữ liệu lên trang Để trình bày dữ liệu trên Webform sau khi thực hiện kết nối CSDL ta sẽ sử dụng trình điều khiển lưới Gridview. Tạo Gridview vào trang từ ngăn Data trên Thanh Toolbox Chọn Choose DataSource là: SqldataSource1 đã tạo Ghi chú: • Chọn mẫu định dạng lưới: Auto Format • Để tạo phân trang dữ liệu: Đánh dấu chọn : Enable Paging • Để cho phép sắp xếp khi click vào tiếu đề cột đánh dấu chọn: Enable Sorting Thi hành tarng DSTacgia.aspx: Trang 52
  59. • Click tiêu đề lưới để kiểm tra tính sắp xếp • Click số thứ tự trang (Cuối lưới) để kiểm tra tính phân trang 3. Điều khiển SQL Data Source và tham số. a. Điều khiển SQL DataSource và Request.QueryString Để lọc dữ liệu trong nguồn dữ liệu theo điều kiện thì giá trị tham số có thể được gán trực tiếp thông qua đối tượng Request.Querystring (Truyền tham số qua liên kết trang.) Tạo trang cho phép truyền tham số qua liên kết. Khi click vào liên kết trang liên kết có địa chỉ kèm theo tham số dạng như sau: Thực hiện: o Tạo trang NhaXB.aspx với nguồn dữ liệu là tòan bộ danh mục nhà xúât bản được trình bày trên lưới GridView như sau o Điều chỉnh bổ sung và lưới 1 cột liên kết Chọn Edit Column từ GiridView Task Trang 53
  60. Thực hiện bổ sung 1 cột dạng HyperLinkField Vớ i các thuộ c tính: . HeaderText: Nhãn tiêu đề cột . Text: Nhãn hiện thị trong cột (Giống nhau trên tất cả các ô) Hoặc . DatTextField: Dùng giá trị từ 1 field chỉ định trong nguồn dữ liệu . DataNavigateUrlFields: Danh mục tên các tham số ghi cách nhau bởi dấu , DataNavigateUrlFormatting: Địa chỉ trang liên kết kèm tham số dạng ~/SachNXB.aspx?MaNXB={0} Trong đó giá trị tham số ghi dưới dạng chỉ số các tham số được khai báo trong thuộc tính DataNavigateUrlFields bắt đầu là 0 và cách nhau là dấu , Thi hành: Trang 54
  61. Tạo trang hiện thị dữ liệu với nguồn dữ liệu có tham số qua liên kết (Request.QueryString). Chỉ định nguồ n dữ liệ u Khai báo điều kiện (Where) với tham số là QueryString. Đặt tên QueryStringField là: MaNXB Add Thi hành : Trang 55
  62. Trang NhaXB.aspx Click vào liên kết Xem sách của 1 nhà xuất bản (VD: Với MaNXB là 2) Các sách của Nhà xuất bản tương ứng sẽ được trình bày b. Điều khiển SQL DataSource và Request.Form Để lọc dữ liệu trong nguồn dữ liệu theo điều kiện thì giá trị tham số là giá trị trên form. Tạo trang Lietkesach.aspx gồm: o 1 Control Textbox chỉ định thuộc tính ID: MaNXB o 1 Button chỉ định thuộc tính PostbackURL: ~/Lietkesach.aspx (Chính trang thiết kế) o Tạo SqlDataSource với nguồn dữ liệu như sau: o Điều kiện cho nguồn dữ liệu Trang 56
  63. Với giá trị điều kiện Form field là: MaNXB (tên Textbx trên trang) Thực thi:Nhập MANXB vào textbox Click nút Xem c. Điều khiển SQL DataSource và điều khiển trình chủ Ta có thể khai báo tham số trong điều khiển SqlDataSource mà giá trị được lấy từ điều khiển trình chủ Vì dụ thiết kế trang Chudesach.aspx thực hiện liệt kê danh mục sách có chủ đề được chọn từ điều khiển trình chủ DropdownList. • Thiết kế Dropdownlist (ddlChude) với nguồn dữ liệu cho từ Table Chude o Tạo SQL DataSource (SqlDataSource1) cho DropDownList Với nguồn dữ liệu cho DropDownList là Table Chude: Trang 57
  64. o Tạo DropDownList vào trang đặt thuộc tính . ID: ddlChude . DataSourceID: SqlDataSource1 . DataTextField: TenCD (Field hiện thị) . AutoPostBack: True . DataValuefield: MaCD (Field giá trị để truyền tham số) • Tạo GridView (GridView1) Với nguồn dữ liệu từ Table Sach Và tham số điều kiện (Where) Trang 58
  65. o Thi hành: Chọn 1 chủ đề sách từ DropdownList thì các sách tương ứng của chủ đề sẽ hiển thị. d. Điều khiển SQL DataSource và thủ tục nội tại Tương tự như trường hợp kết nối CSDL bằng phát biểu SQL ta có thể sử dụng điều khiển kết nối CSDL SqlDatasource để truy cập CSDL SQL Server bằng thủ tục nội tại (Stored Procedure) Ví dụ trong CSDL SQLServer QLBanSach ta tạo 1 thủ tục (Stored Procedure) Sachtheogia cho phép liệt kê các quyển sách với 2 tham số cho Procedure là Giatu và Giaden. Trang 59
  66. Use QLBansach Create Proc Sachtheogia @Giatu int, @Giaden Int as Select Masach, Tensach, Dongia, Mota, Tenchude, TenNXB,Ngaycapnhat From sach s, Chude c, nhaxuatban n Where c.MaCD=s.MaCD and n.MaNXB=s.MaNXB and Dongia Between @Giatu and @Giaden Lưu ý : Trong thủ tục có khai báo 2 tham số tên @Giatu và @Giaden Khi cấu hình Data Source cho điều khiển SqlDataSource Ta chọ n : Specify a Custom SQL satament or stored procedure Tiếp tục chọn Stored Procedure cần kết nối. Trang 60
  67. Xác định giá trị cho tham số của Procedure có thể là: Giá trị trực tiếp, QueryString, Form, hay điều khiển trình chủ (Ví dụ sử dụng điều khiển trình chủ DropDownlist1, DropDownList2 tương ứng 2 tham số Giatu và Giaden) Thi hành: Hãy Click chọn Giá từ DropDownList1 và Giá đến DropDownList2thì các sách thõa điều kiện giá sẽ hiện thị tương ứng vào GridView II. KẾT NỐI CƠ SỞ DỮ LIỆU VỚI ACCESS, XML 1. Điều khiển Access Data Source Trang 61
  68. Tương tự như điều khiển kết nối cơ sở dữ liêu SQLDataSource dùng để kết nối với cơ sở dữ liệu SQLserver điều khiển kết nối cơ sở dữ liệu AccessDataSource dùng để kết nối với cơ sở dữ liệu Access MDB). Như vây khi có nhu cấu kết nối với CSDL Acces ta dùng điều khiển AccessDataSource từ ngăn Data trên thanh Toolbox. Ví dụ thiết kế trang DanhsachKH.aspx truy xuất và hiện thị Danh sách khách hang từ Table khachhang của CSDL QLBansach.mdb (Access) • Tạo AccessDataSource vào trang • Chọn Configure Data Source . . .: Để thực hiện kết nối • Chọn Nút Browse để tìm và chọn CSDL Access : QLBansach (Thông thướng được tổ chức lưu trữ trong thư mục App_Data của ứng dụng) • Chọn Ok và chọn Next để tiếp tục • Xác định nguồn dữ liệu (Khai báo điều kiện và sắp xếp nếu có) tiếp tục chọn Next Trang 62
  69. • Chọn Test Query để xem kết quả, chọn Finish để hòan tất • Tạo điều khiển lưới gridView và chỉ định nguồn dữ liệu là AccessdataSource1 vừa tạo. Trang 63
  70. • Thi hành xem kết quả Ghi chú: Để truyền giá trị cho các tham số theo các hình thức: Form, QueryString, Control, . . . ta khai báo tương tự như sử dụng điều khiển SQLDataSource . 2. Điều khiển XML DataSource Ngòai các điều khiển kết nối CSDL SQLDataSource, AccessDataSource chúng ta có thể sử dụng điều khiển kết nối CSDL định dạng XML. Tuy nhiên khác với SQLDataSource, AccessDataSource khi sử dụng điều khiển XMDataSource ta cần có tập tin XML. Sử dụng điều khiển XMLDataSource từ ngăn Data trên thanh Toolbox. Ví dụ thiết kế trang DanhsachSV.aspx hiện thị từ tập tin XML (DanhsachSV.XML) Trang 64
  71. • Tạo tập tin DanhsachSV.XML • Triệu gọi trang DanhsaxhSV.xml lên trình duyệt có kết quả như sau: • Tạo điều khiển XMLDataSource vào trang DanhsachSV.aspx • Chọn Configure Data Source . . .: Để thực hiện kết nối • Chọn Nút Browse để tìm và chọn tập tin DanhsachSV. Trang 65
  72. • Chọn Ok để hòan tất • Tạo điều khiển lưới gridView và chỉ định nguồn dữ liệu là AccessdataSource1 vừa tạo. • Thi hành xem kết quả III. KẾT NỐI VÀ CẬP NHẬT CSDL SQLDataSource và Access DataSource ngoài chức năng thong thường cho phép tạo kết nối CSDL và truy xúât dữ liệu còn cho thực hiện các thao tác cập nhật dữ liệu như: Thêm, Xóa, Sửa (Insert, Update. Delete) Ví dụ minh họa: Thực hiện chức năng “Nhập sách mới” vào Table Sach CSDL trong QLBansach. Trang web được thiết kế với các Control tương ứng dư liệu cần nhập mới vào Table Sach Trang 66
  73. Tạo Control SqlDataSource vào trang Tạo kết nối với CSDL QLBansach cho SqlDataSource o Chọn “Specify columns from a table or view” o Name: Sach o Columns : chọn tất cả các cột cần nhập mới dữ liệu tương ứng 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) o Click Next Finish o Phải chuột SqlDataSource1, chọn Property, chọn thuộc tính o “InsertQuery” : Câu lệnh nhập liệu o DeleteQuery: Câu lệnh xóa dữ liệu o UpdateQuery: Câu lệnh cập nhật sự điều chỉnh dữ liệu. Trang 67
  74. Liên kết 1 cột trong bảng với 1 control trong màn hình (ví dụ cột Tensach liên kết với control txtTensach) o Parameters : MaBanTin (tên field cần nhập liệu) o Parameter source : Control o ControlID : txtMaBanTin (Tên Control chứa DL cần them) Tương tự cho các cột khác Trong trường hợp cột Hinhminhoa thì bấm vào “Show advanced properties” o PropertyName chọn FileName Trang 68
  75. o Viết hàm xử lý sự kiện click cho nút Lưu protected void btnLuu_Click(object sender, EventArgs e) { SqlDataSource1.Insert(); } o Chạy và kiểm tra chương trình. Trang 69
  76. Bài 4. CÁC ĐIỀU KHIỂN LIÊN KẾT DỮ LIỆU Sử dụng các điều khiển GridView, Data List và Repeater để hiển thị dữ liệu. I. Điều khiển GridView GridView là một điều khiển khá linh hoạt và hiệu quả trong việc hiển thị, định dạng và thao tác với dữ liệu. Bên cạnh đó, chúng ta có thể thực hiện sắp xếp dữ liệu, thực hiện phân trang với sự hỗ trợ khá tốt của VS .Net trong quá trình thiết kế. 1. Tạo GridView vào trang Kéo Control GridView vào trang Kế t nố i nguồ n dữ liệ u Chèn them cộ t mớ i Điều chỉ nh các cộ t Tạ o các cộ t tùy biế n 2. Định dạng tự động Thực hiện chọn những mẫu định dạng có sẳn quy định về khung viền màu nên bằng cách Chọn Auto Format từ khung DataGrid Task 3. Kết nối nguồn dữ liệu Thực hiện kết nối nguồn dữ liệu với cơ sở dữ liệu Access, SQLServer, . . Trong cửa sổ DataGrid Task tại mục Choose Data Source chọn : New Data Source o Với CSDL Access Trang 70
  77. Xác định nguồn dữ liệu từ Table, Quyery hay câu lệnh truy vấn có thể chỉ định điều kiện lọc dữ liệu và sắp xếp. Trang 71
  78. Khai báo tham s ố điề u ki ệ n Ch ỉ đị nh s ắ p x ế p Chọn Test Query để kiểm tra kết quả nguồn dữ liệu. Chọn Finish để hòan thành o Với CSDL SQLServer Trang 72
  79. Vớ i CSDL SQLServer 2000/2005 Tạ o kế t nố i CSDL mới Khai báo các thông số và chọn CSDL cần kết nối Kiể m tra ếkt quả kế t nố i Trang 73
  80. . Chọn Ok . Xác định nguồn dữ liệu từ Table, Quyery hay câu lệnh truy vấn có thể chỉ định điều kiện lọc dữ liệu và sắp xếp. Khai báo tham số điều kiệ n Chỉ định sắ p xế p - Chọn Test Query để kiểm tra kết quả nguồn dữ liệu. Chọn Finish để hòan thành Thi hành xem kết quả: Trang 74
  81. 4. Thêm cột • Trong cửa sổ DataGrid Task chọn : Add New Column • Chọn Loại field cần tạo : BoundField • Khai báo tiêu đề côt : Header Text • Chỉ định tên field dữ liệu: DataField • Ok hòan thành 5. Hiệu chỉnh, Tạo mới các cột • Trong cửa sổ DataGrid Task chọn : Edit Column Trang 75
  82. • AvailableFields: Chọn lọai Field liên kết dữ liệu o BoundField: Cột có liên kết với nguồn dữ liệu dạng Textbox. o Checkbox Field: Cột có liên kết với nguồn dữ liệu dạng Checkbox. o Hyperlink Field: Cột có liên kết dữ liệu dạng liên kết. o Button Field: Cột dạng nút lệnh o CommandField: Cột dạng nút lệnh đã được thiết kế sẵn. Điều khiển GridView cung cấp cho chúng ta 3 loại cột dạng này: . Select: Nút lệnh chọn dòng dữ liệu . Edit, Cancel, Update: Các nút lệnh hỗ trợ chức năng cập nhật dữ liệu trực tiếp trên lưới. . Delete: Nút lệnh xóa dòng dữ liệu Chúng ta sẽ có dịp tìm hiểu kỹ hơn về các nút lệnh này trong phần Cập nhật dữ liệu trực tiếp trên lưới. o TemplateField: Cột do người dùng tự thiết kế. Đây là loại cột có khả năng làm việc khá linh họat. Ví dụ bạn cần hiển thị danh sách khách hàng. Tại cột Phái, bạn muốn hiển thị dạng Nam/Nữ. Chúng ta sẽ tìm hiểu sâu hơn về Template Column ở phần sau. • BoundColumn properties: Qui định thông tin chi tiết cho các cột o HeaderText, Footer Text: Thông tin tiêu đề trên/dưới của cột o Header Image: Hình hiển thị trên tiêu đề cột (thay thế thông tin tiêu đề cột - Header Text). o Sort Expression: Biểu thức sắp xếp của cột. o Visible: Qui định cột có được hiển thị hay không. o DataField: Qui định tên field hay tên thuộc tính của đối tượng dữ liệu cần hiển thị. o Data formatting expression: Biểu thức định dạng dữ liệu. Mẫu định dạng: {0: }. Ví dụ: + Định dạng số: {0:000.00}, {0:0.##} + Định dạng ngày giờ: {0:dd/MM/yyyy}, {0:hh/mm/ss tt} • Convert this Field into a Template Column: Chuyển cột hiện hành thành cột dạng Template Column. 6. Thiết lập các thuộc tính định dạng lƣới Để thực hiện các thao tác thiết lập các thuộc tính, chúng ta chọn GridView Properties. • Hiện / Ẩn : Header / Footer - Phần đầu và chân của GridView o Show header: Qui định dòng tiêu đề trên có được phép hiển thị hay không. (mặc định là có hiển thị dòng tiêu đề) Trang 76
  83. o Show footer: Qui định dòng tiêu đề dưới có được phép hiển thị hay không. (mặc định là không hiển thị dòng tiêu đề dưới) • Định dạng dòng Header/Footer: HeaderStyle / FooterStyle • Định dạng dòng dữ liệu lẽ/chẵn: RowStyleAlternatingRowStyle Sắ p xế p: AllowSorting Allow sorting: Có cho phép sắp xếp dữ liệu hay không. (mặc định là không cho phép sắp xếp) • Phân trang: AlowPaging o Định dạng cho phân trang Trang 77
  84. . Page size: Qui định số dòng của mỗi trang. . Possition: Qui định vị trí hiển thị của bộ nút di chuyển. Ở phía trên thanh tiêu đề, ở phía dưới hay cả hai. . Mode: Qui định hình thức hiển thị của bộ nút di chuyển. Hiển thị dạng số trang hay là các chuỗi ký tự đại diện (Next page/Previous page button text). Trong trường hợp hiển thị dạng số, Numeric buttons qui định số nút lệnh được hiển thị tối đa. Google hiển thị kết quả đƣợc phân trang theo dạng số II. Điều khiển DataList 1. Sử dụng DataList để hiển thị dữ liệu Như điều khiển Gridview, điều khiển DataList được sử dụng để hiển thị dữ liệu. Tuy nhiên, đối với DataList, chúng ta phải tự thiết kế hình thức hiển thị dữ liệu (giống như Template Column của GridView). Trang 78
  85. Sử dụng DataList hiển thị thông tin sách Một số thuộc tính cần chú ý của DataList • RepeatDirection: Qui định hướng hiển thị dữ liệu o Horizontal: Hiển thị dữ liệu theo chiều ngang o Vertical (mặc định): Hiển thị dữ liệu theo chiều đứng • RepeatColumns: Qui định số cột hiển thị của DataList Thiết kế hình thức hiển thị cho DataList cũng tương tự như thiết kế cho cột Template Column của GridView Chọn Edit Template từ thực đơn ngữ cảnh để thực hiện thiết kế hình thức hiển thị cho DataList. Trang 79
  86. Chọn chức năng thiết kế cho DataList Ghi chú: Trong quá trình thực hành, để công việc thiết kế được dễ dàng, các bạn thực hiện thiết kế ở bên ngoài điều khiển DataList. Sử dụng Table để định vị trí hiển thị của các điều khiển. Sau khi hoàn tất công việc thiết kế, chúng ta kéo kết quả đã thiết kế vào vị trí cần hiển thị trong DataList. Ví dụ: Hiển thị thông tin sách với DataList Thiết kế thông tin sách với DataList Kết quả trên trang Web III. Điều khiển Repeater Như 2 điều khiển DataList & DataGrid, điều khiển Repeater cũng được dùng để hiển thị dữ liệu. Tuy nhiên, để hiển thị dữ liệu, chúng ta phải tự thiết kế hình thức hiển thị thông qua các tag HTML. Trang 80
  87. Điều khiển Repeater có các tag sau: • (tùy chọn) Qui định hình thức hiển thị cho tiêu đề. (Chỉ xuất hiện 1 lần, phía trên của điều khiển) • (Bắt buộc phải có) Qui định hình thức hiển thị cho các mục dữ liệu trong điều khiển. • (tùy chọn) Qui định hình thức hiển thị cho các mục dữ liệu trong điều khiển. Nội dung được qui định trong cặp tag này sẽ hiển thị xen kẽ với các nội dung trong cặp tag • (tùy chọn) Qui định hình thức hiển thị giữa các dòng dữ liệu • (tùy chọn) Qui định hình thức hiển thị cho tiêu đề dưới. (Chỉ xuất hiện 1 lần, phía dưới của điều khiển) Ví dụ: Bước 1. Tạo mới điều khiển Repeater: rptChudesach vào trang Web. Điều khiển rptChudesach trên trang Web Bước 2. Kết nối và tạo nguồn dữ liệu cho điều khiển từ Table Chude với các cột: MaCD, Tenchude. Bước 3:. Chuyển qua xem trang Web dưới dạng HTML Bước 3. Bổ sung các tag sau Mã CĐ Tên chủ đề Trang 81
  88. Bước 4. Xem lại màn hình thiết kế và thực thi kết quả. V. Sử dụng DetailView và FormView Hai điều khiển này cho phép bạn làm việc với một trường dữ liệu đơn tại mỗi thời điểm Cả hai điều khiển này cho phép bản thay đổi, thêm mới hay xoá dữ liệu như một bản ghi cơ sở dữ liệu, và nó cho phép bạn chuyển sang trang tiếp theo hay quay lại trang trước thông qua thiết lập dữ liệu. 1. DetailView a. Hiển thị dữ liệu với DetailView DetailView được đưa ra hiển thị như một bảng( ) trong HTML để hiển thị dữ liệu một bản ghi. Ví dụ: Trang XemthongtinKH.aspx b. Sử dụng Fields với điều khiển DetailView DetailView hỗ trợ tất cả các Field như GridView o BoundField: cho phép bạn hiển thị giá trị của dữ liệu như Text o CheckBoxField: hiển thị dữ liệu dưới dạng một CheckBox o CommandField: hiển thị liên kết cho phép chỉnh sửa, thêm mới, xoá dữ liệu. o ButtonField: hiển thị dữ liệu như một button(ImageButton, ) o HyperLinkField: hiển thị môt liên kết o ImageField: hiển thị ảnh o TemplateField: cho phép hiển thị các đìều khiển tuỳ biến. Trang 82
  89. c. Xử lý phân trang với điều khiển DetailView Để tạo phân trang chỉ định thuộc tính AllowPaging=”true” cho điều khiển DetailView. Với các thuộc tính định dạng thuộc nhóm thuộc tính: Pagersettings d. Minh họa: Trong ví dụ trên bạn liên kết dữ liệu với Table Khachhang đưa vào 5 BoundField và một CheckBoxField, điền vào dữ liệu với thuộc tính DataField và thiết đặt cho nó tiêu dề với HeaderText. Tạo phân trang và định dạng trình bày tại góc trên bên phải. Kết xuất của chương trình 2. DetailView a. Hiển thị dữ liệu với FormView FormView được đưa ra hiển thị dữ liệu với các điều khiển tùy biến để hiển thị dữ liệu một bản ghi. Ví dụ: Trang XemthongtinNXB.aspx Trang 83
  90. b. Trình bày dữ liệu sử dụng Edit Template FormView hỗ trợ trình bày dữ liệu dạng tùy biến cho tất cả các Field DataList o Tạo FormView vào trang và lien kết dữ liệu o Tại cửa sổ thiết kế chọn Edit Tempalte từ cửa sổ FormView Task o Thiết kế trình bày với các Control điều khiển tương tự như khi thiết kế DataList với các điều khiển tùy biến c. Xử lý phân trang với điều khiển DetailView Để tạo phân trang chỉ định thuộc tính AllowPaging=”true” cho điều khiển DetailView. Với các thuộc tính định dạng thuộc nhóm thuộc tính: Pagersettings Trang 84
  91. d. Minh họa: Trong ví dụ trên bạn liên kết dữ liệu với Table NhaXuatBan đưa vào 4 Label, điền vào dữ liệu với thuộc tính Text cho các File tương tứng và thiết đặt cho nó tiêu dề với HeaderText. Tạo phân trang và định dạng trình bày tại phía dưới giữa trang Kết xuất của chương trình Trang 85