Bài giảng lập trình web asp net với c chương 5 th s phạm đào minh vũ

Khoa CNTT Trường CĐ CNTT TP.HCM Tạo kết nối Kéo điều khiển SQLDataSource từ Toolbox vào trang Chọn Configure Data Source ... Điều khiển SQL DataSource và tham số Request.QueryString Để

Giảng Viên: Th.S Phạm Đào Minh Vũ Email: phamdaominhvu@yahoo.com

1

LẬP TRÌNH WEB ASP.NET VỚI C#

Ch ương 5 Các Điều Khiển Liên Kết CSDL

5.1 Điều khiển kết nối cơ sở dữ liệu

5.2 Điều khiển liên kết cơ sở dữ liệu

162

5.1 Điều khiển kết nối CSDL–Data-Source Control

rút trích từ các hệ QT CSDL như: Access, SQLServer,

XML, Ocracle

Access Data Source, XML Data Source,

Khoa CNTT Trường CĐ CNTT TP.HCM

CSDL MẪU

164

5.1.1 Điều khiển SQLDataSource

 Dùng để kết nối CSDL trong các hệ quản trị CSDL SQLServer, Ocracle Server,

hay câu lệnh SQL và khai báo điều kiện lọc (Where) với nhiều cách như: Giá trị định sẳn, đối tượng Session, Request.Form, Request.QueryString

Khoa CNTT Trường CĐ CNTT TP.HCM

Tạo kết nối

Kéo điều khiển SQLDataSource từ Toolbox vào trang

Chọn Configure Data Source 

Nếu trước đó đã tạo kết nối thì chọn kết nối đã có Ngược lại để tạo mới kết nối thì chọn New Connection

Tạo kết nối CSDL mới

166

Khoa CNTT Trường CĐ CNTT TP.HCM

 Chọn QTCSDL (Microsoft SQLServer)

 Chọn Continue để tiếp tục

Chọn Hệ QT CSDL

Khai báo các thông số cho kết nối

Chọn Tên Server Chọn thông tin đăng nhập

Chọn tên CSDL

Kiểm tra kết nối

Đồng ý kết nối

168

Khoa CNTT Trường CĐ CNTT TP.HCM

Đặt tên cho kết nối

Tên kết nối

Xác định nguồn dữ liệu từ Table, View hay câu lệnh SQL có thể chỉ định điều kiện lọc dữ liệu, sắp xếp hay các chỉ định vcho xử lý thêm, xoá, sửa

Xác định nguồn dữ liệu

Từ câu lệnh SQL hay

Từ Table, View Xác định điều kiện

Chỉ định sắp xếp

Các lệnh thê, xoá, sửa

170

Khoa CNTT Trường CĐ CNTT TP.HCM

 Chọn Test Query để kiểm tra kết quả nguồn dữ liệu

 Chọn Finish để hòan thành

Điều khiển SQL DataSource và tham số Request.QueryString

Để lọc 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)

Khi click vào liên kết trang có địa chỉ kèm theo tham số dạng:

http://localhost:49222/ /SachNXB.aspx?MaNXB=3

172

Khoa CNTT Trường CĐ CNTT TP.HCM

Thực hiện:

Tạo trang NhaXB.aspx là danh mục nhà xuất bản

Chọn Edit Column từ GiridView Task

174

Khoa CNTT Trường CĐ CNTT TP.HCM

Với các thuộc tính:

cách nhau bởi dấu “,”

tham số dạng: ~/SachNXB.aspx?MaNXB={0}

Giá trị tham số ghi dưới dạng chỉ số các tham số được khai báo trong DataNavigateUrlFields bắt đầu là 0 và cách nhau dấu ,

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)

Xác định nguồn dữ liệu, sau đó chọn Where để chỉ định điều kiện

176

Khoa CNTT Trường CĐ CNTT TP.HCM

Chọn Add để chấp nhận thêm tham số

Columns: Tên cột làm điều kiện

Operator: Toán tử so sánh

Source: Loại tham số (QueryString)

QueryString field: Tên tham số đã truyền

Chọn Add để chấp nhận thêm tham số

178

Khoa CNTT Trường CĐ CNTT TP.HCM

Thi hành xem kết quả

Điều khiển SQL DataSource và tham số Request.Form

Để lọc dữ liệu trong nguồn dữ liệu theo điều kiện với giá trị tham số là giá trị trên form

Thực hiện:

Tạo trang Lietkesach.aspx gồm:

1 Textbox thuộc tính ID: MaNXB

1 Button thuộc tính PostbackURL:

~/Lietkesach.aspx (Chính trang thiết kế) Tạo SqlDataSource với nguồn dữ liệu:

180

Khoa CNTT Trường CĐ CNTT TP.HCM

Tạo SqlDataSource với nguồn dữ liệu như sau:

 Columns: Tên cột làm điều kiện

 Operator: Toán tử so sánh

 Source: Loại tham số (Form)

 Form field: Tên tham số đã truyền (Tên Textbox)

 Chọn Add để chấp nhận thêm tham số

182

Khoa CNTT Trường CĐ CNTT TP.HCM

Điều khiển SQL DataSource và tham số là các Controls

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 SachtheoCD.aspx thực hiện liệt

kê danh mục sách có chủ đề được chọn từ điều

khiển DropdownList

184

Khoa CNTT Trường CĐ CNTT TP.HCM

GridView (GridView1) Với nguồn dữ liệu từ Table Sach

Và tham số điều kiện (Where)

 Columns: Tên cột làm điều kiện

 Operator: Toán tử so sánh

 Source: Loại tham số (Control)

 ControlID: Tên tham số đã truyền

 Chọn Add để chấp nhận thêm tham số

186

Khoa CNTT Trường CĐ CNTT TP.HCM

Điều khiển SQL DataSource và Procedure

Ta có thể sử dụng điều khiển kết nối CSDL SqlDatasource để truy cập gọi Stored Procedure trong CSDL SQL Server

Ví dụ: Ta có Procedure Sachtheogia liệt kê các quyển sách với điều kiện Giá từ 2 tham số là Giatu

và Giaden

@Giatu int, @Giaden int

Khi cấu hình cho điều khiển SQLDataSource

Chọn loại nguồn dữ liệu là từ Procedure

188

Khoa CNTT Trường CĐ CNTT TP.HCM

Chọn tên Procedure

Xác định giá trị cho các tham số của Procedure

190

5.1.2 Điều khiển Access DataSource

Khoa CNTT Trường CĐ CNTT TP.HCM

Chọn Configure Data Source : Để thực hiện kết nối

Xác định nguồn dữ liệu và điều kiện tham số như SQLData Source

192

5.1.3 Điều khiển XMLDataSource

< Sinhvien MaSV ="SV01" HotenSV ="Trần Văn Nam"

Diachi ="123 Trần Hưng Đạo, Q5" Email ="nam@gmail.com" /> < Sinhvien MaSV ="SV02" HotenSV ="Nguyễn Thị Lý"

Diachi ="45 Hai Bà Trưng, Q1" Email ="lythi@yahoo.com" />

< Sinhvien MaSV ="SV03" HotenSV ="Nguyễn Thị Bình"

Diachi ="31 Lý Thường Kiệt,TB" Email ="kiet@gmail.com"/>

</ DSSinhvien >

Tạo XMLDataSource từ Toolbox

Chọn Configure Data Source : Để thực hiện kết nối

194

Khoa CNTT Trường CĐ CNTT TP.HCM

5.2 Điều khiển liên kết cơ sở dữ liệu

 Tạo GridView vào trang

Kéo Control GridView vào trang

198

Khoa CNTT Trường CĐ CNTT TP.HCM

 Định dạng tự động

Chọn những mẫu định dạng có sẳn Gridview bằng cách Chọn Auto Format từ khung Gridview Task

 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 SQLServer, Access, XML

Tại mục Choose Data Source: New Data Source

(Hoặc chọn Datasource đã được tạo trước đó)

Ghi chú: Tạo Datasource như được trình bày trước

200

Khoa CNTT Trường CĐ CNTT TP.HCM

Thi hành xem kết quả:

Thêm cột

Trong cửa sổ Gridview Task chọn : Add New Column

 Chọn Loại field : BoundField

 Tiêu đề côt : Header Text

 Tên field dữ liệu: DataField

 Ok hòan thành

AvailableFields: Chọn lọai Field liên kết dữ liệu

Select: Nút lệnh chọn dòng dữ liệu

Edit, Cancel, Update: Các nút cập nhật d.liệu

Delete: Nút lệnh xóa dòng dữ liệu

204

Khoa CNTT Trường CĐ CNTT TP.HCM

Convert this Field into a Template Column: Chuyển cột hiện hành thành cột dạng Template Column

BoundColumn properties: Thông tin chi tiết cho các cột

{0:<chuỗi định dạng>}

Vd: {0:000.00}, {0:0.##}

{0:dd/MM/yyyy}, {0:hh/mm/ss tt}

 Thiết lập các thuộc tính định dạng lưới

Chọn GridView  Properties

chân của GridView

206

Khoa CNTT Trường CĐ CNTT TP.HCM

- RowStyleAlternatingRowStyle: Định dạng dòng dữ liệu lẽ/chẵn:

208

Khoa CNTT Trường CĐ CNTT TP.HCM

- Page size: Qui định số dòng/trang

- Possition: Qui định vị trí hiển thị của

bộ nút di chuyển (top, bottom,

top&bottom)

- Mode: Qui định hình thức hiển thị của

bộ nút di chuyển (kiểu số, kiểu ký hiệu)

- AllowSorting: Sắp xếp (theo thuộc tính DataKeyNames

210

5.2.2 Điều khiển DataList

Khoa CNTT Trường CĐ CNTT TP.HCM

 Giới thiệ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)

Một số thuộc tính cần chú ý

212

Khoa CNTT Trường CĐ CNTT TP.HCM

- 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

Ghi chú:

Để công việc thiết kế được dễ dàng, thực hiện thiết kế ở bên ngoài điều khiển DataList Sử dụng Table để định vị trí các điều khiển Sau khi thiết kế

hoàn tất, kéo kết quả vào vị trí hiển thị trong DataList

214

Khoa CNTT Trường CĐ CNTT TP.HCM

Datalist không hỗ trợ phân trang như Gridview, vì vậy cần phải tạo phân trang bằng tay Công cụ CollectionPager là 1 control cho phép tạo phân trang

mà không cần viết nhiều code

Phân Trang Datalist với CollectionPager

Thực hiện

1 Download file CollectionPager.dll, chép vào thư mục

BIN của website

2 Đưa control này vào toolbox

RightClick vào công cụ

Standard của toolbox ->chọn

Choose Item

Thực hiện

4 Kéo thả CollectionPager vào trang và tùy chỉnh thông số

5 Viết code trong sự kiện Page_Load của trang

protected void Page_Load( object sender, EventArgs e)

{

//lấy dữ liệu từ SQLDatasource

DataView dv =

( DataView )SqlDataSource1.Select( DataSourceSelectArguments Empty);

CollectionPager1.DataSource = dv; //chỉ định datasource cho CollectionPager

//Chỉ định đối tượng Datalist mà CollectionPager sẽ phân trang

CollectionPager1.BindToControl = DataList1;

//gán dữ liệu đã phân trang cho Datalist

DataList1.DataSource = CollectionPager1.DataSourcePaged;

}

218

Khoa CNTT Trường CĐ CNTT TP.HCM

 CollectionPager không chỉ hoạt động trên Datalist mà còn hoạt động với các Điều khiển hiển thị dữ liệu khác như Repeater, …hoặc bất kỳ đối tượng nào cần phân trang

 Ngoài việc sử dụng CollectionPager, việc phân trang còn có thể thực hiện bằng việc viết mã (sinh viên tự tìm hiểu thêm )

5.2.3 Điều khiển Repeater

Giới thiệu:

Như DataList & DataGrid, điều khiển Repeater dùng để hiển thị dữ liệu Tuy nhiên phải tự thiết kế hình thức hiển thị thông qua các tag HTML

5.2.4 Detailview & FormView

Giới thiệu:

Hai điều khiển này cho phép làm việc với một trường dữ liệu đơn tại mỗi thời điểm Thực hiện được chức năng xem, thay đổi, thêm mới hay xoá, di chuyển sang trang tiếp theo hay quay lại trang trước

224

Detailview

Khoa CNTT Trường CĐ CNTT TP.HCM

Hiển thị dữ liệu với DetailView

DetailView được đưa ra hiển thị như 1 bảng(<Table>)trong HTML để hiển thị dữ liệu 1 bản ghi

Ví dụ: Trang XemthongtinKH.aspx

Sử dụng Fields với điều khiển DetailView

DetailView hỗ trợ tất cả các Field như GridView : BoundField,CheckBoxField,CommandField,ButtonField, HyperLinkField, ImageField, TemplateField

226

Khoa CNTT Trường CĐ CNTT TP.HCM

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: Pagersettings

Minh họa:

Trong ví dụ liên kết dữ liệu với Table Khachhang đưa vào 5 BoundField và một CheckBoxField, điền dữ liệu vào với thuộc tính DataField và thiết đặt tiêu dề (HeaderText) Tạo phân trang và trình bày tại góc trên bên phải

228

Formview

Khoa CNTT Trường CĐ CNTT TP.HCM

Hiển thị dữ liệu với FormView

FormView dùng để hiển thị dữ liệu với các điều khiển tùy biến cho dữ liệu một bản ghi Ví dụ: Trang XemthongtinNXB.aspx

Trình bày dữ liệu sử dụng Edit Template

Tạo FormView vào trang và liên kết dữ liệu

Tại cửa sổ thiết kế chọn Edit Tempalte từ cửa sổ FormView Task

230

Khoa CNTT Trường CĐ CNTT TP.HCM

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

Xử lý phân trang với điều khiển FormView

Để tạo phân trang chỉ định thuộc tính AllowPaging=”true” cho điều khiển Form Với các thuộc tính định dạng thuộc nhóm: Pagersettings