Bài giảng Phát triển web nâng cao - Chương VII: Kết gán dữ liệu

CHƯƠNG VII:  KẾT GÁN DỮ LIỆU 
Lý thuyết : 3 tiết 
Thực hành 12 tiết 
Data Controls 
DataGrid =Table(động được tạo trên server) 
Repeater 
DataList 
GridView 
Các properties của Data Controls 
Properties 
DataList 
DataGrid 
Column Layout(sắp xếp theo cột) 
X 
Paging(Hiển thị số trang) 
X 
Select/Edit/Delete 
X 
X 
Sort 
X 
Style Properties(Kiểu c á ch) 
X 
X 
Table Layout(Hiển thị kiểu Bảng) 
X 
Template(Sử dụng khuôn mẫu) 
X 
X 
DataGrid 
Ý nghĩa: Cung cấp một dạng bảng tính dữ liệu từ data source 
Gồm tập các cột, một header, một footer. 
Các cột có thể tự động tạo hoặc tường minh 
Thuộc tính: 
03CDTH632 
. 
03CDTH892 
Student ID 
DataField 
. 
DataField 
HeadText 
Properties 
Descriptions 
AutoGenerateColumns 
Tạo column tự động() 
Column (Design & Coding) 
Bound Column 
Cột dữ liệu 
Button Column 
Cột dạng Button 
HyperLink Column 
Cột dạng Liên Kết 
Template Column 
Cột tự thiết kế 
EditItemStyle 
Định dạng cho Item 
Header Style(Show Footer: true) 
Định dạng Header 
Footer Style(Show Header: true) 
Định dạng Footer 
GridLines 
Hiển thị dạng lưới 
Ví dụ: 
Tạo điều khiển (Design) 
Ràng buộc vào DataReader/Dataset: (Coding) 
dgAuthors.DataSource = dr; 
dgAuthors.DataBind(); 
dgAuthors.DataSource = ds.Table[0]; 
dgAuthors.DataBind(); 
DataGrid – Ví dụ 
 <asp:DataGrid ID="DataGrid1" runat="server" 
 Style="z-index: 100; left: 55px; position: absolute;top: 15px"> 
DataGrid Editing 
Sử dụng EditCommandColumn 
Thuộc tính EditItemIndex (-1 ->không có dòng nào được hiệu chỉnh) 
EditCommandColumn hiển thị 3 liên kết tương ứng 3 sự kiện: OnEditCommand, OnUpdateCommand, OnCancelCommand 
DataGrid Editing 
DataGridCommandEventArgs chứa thông tin của dòng sẽ được hiệu chỉnh 
Thuộc tính DataKeyField thiết lập khóa chính 
Sự kiện UpdateCommand , truy xuất tập các DataKeys để thao tác trên khóa chính 
GridView các sự kiện 
OnEditCommand =“ FunctionEdit " 
OnCancelCommand =“ FunctionCancel “ 
OnPageIndexChanged =“ FunctionPage " 
OnDeleteCommand =“ FunctionDelete " 
OnItemCommand =“ FunctionCommand " 
Gán dữ liệu Access vào DataGrid 
protected void Page_Load(object sender, EventArgs e) 
 { String strCon = "Provider=Microsoft.Jet.OleDb.4.0;Data Source = "; 
 strCon = strCon + Server.MapPath(".") + "\\App_Data\\SV.mdb"; 
 OleDbConnection con = new OleDbConnection(strCon); 
 con.Open(); 
 String strOLE = "select * from tblSinhVien"; 
 OleDbDataAdapter adap = new OleDbDataAdapter(strOLE, con); 
 DataSet ds = new DataSet(); 
 adap.Fill(ds); 
 DataGrid1.DataSource = ds; //kết gán dl với GridView có id là GridView1 
 DataGrid1.DataBind();	 
 } 
// lưu ý using System.Data.OleDb; 
Gán dữ liệu SQL vào DataGrid 
protected void Page_Load(object sender, EventArgs e) 
 { string strconn = "server=TRUCLY-PC\\SQL2005;database=SINHVIEN;uid=sa;pwd=sa"; 
 SqlConnection conn = new SqlConnection(strconn); 
 string sql = "SELECT * FROM tblsinhvien"; 
 SqlCommand cmd = new SqlCommand(sql, conn); 
 conn.Open(); 
 SqlDataAdapter adap=new SqlDataAdapter(sql,conn); 
 DataSet ds = new DataSet(); 
 adap.Fill(ds); 
 DataGrid1.DataSource = ds; //kết gán dl với DataGrid1 
	DataGrid1.DataBind(); 
 } 
Hiệu chỉnh dữ liệu - DataGrid 
Hiệu chỉnh DataGrid – Mã lệnh 
protected override void OnLoad(EventArgs e) { 
 if (!IsPostBack) 
 	BindGrid(); 
 	base .OnLoad(e); } 
public void gd1_Edit( object src, DataGridCommandEventArgs e) { 
 	gd1.EditItemIndex = ( int )e.Item.ItemIndex; 
 	BindGrid();	} 
public void gd1_Cancel( object src, DataGridCommandEventArgs e) { 
 	gd1.EditItemIndex = -1; 
 	BindGrid(); 
	} 
Đặc điểm khác của DataGrid 
Tùy biến giao diện GridView 
ButtonColumn : hiển thị nút nhấn nhằm thực thi một lệnh nào đó. 
Thuộc tính AllowSorting : hiển thị tiêu đề cột như một siêu liên kết. 
Thuộc tính SortField : chỉ ra field được sắp xếp. 
 PROPERTY DATAGRID 
Định dạng Datagrid 
Thực hành: Sử dụng DataGrid 
Tạo một OleDbConnection 
Tạo một OleDbCommand 
Tạo a DataReader 
Kéo một DataGrid vào Web Form 
Ràng buộc DataSource vào DataGrid 
Repeater 
Ý nghĩa: 
Ràng buộc dữ liệu từ danh sách các item. Hiển thị dữ liệu dựa trên các phần tử HTML 
Templates: 
DataBinder 
Phân tích và đánh giá biểu thức ràng buộc dữ liệu 
Tính toán biểu thức ràng buộc dữ liệu để rút trích dữ liệu đúng trong template 
Container.DataItem trả về đối tượng Object 
DataBinder.Eval() là hàm tĩnh sử dụng Reflection 
Không quan tâm đến kiểu của nguồn dữ liệu (data source) 
DataBinder – Ví dụ 
A Repeater control in use 
DataList 
Sử dụng DataList hiển thị dữ liệu từ data source 
Sử dụng khi hiển thị dữ liệu dạng danh sách (tương tự dạng Table) 
Đơn giản hơn DataGrid 
Ít nhất có ItemTemplate 
Mỗi template có kiểu dáng riêng (HeaderStyle và ItemStyle) 
DataList – Ví dụ 
Datalist 
Ràng buộc dữ liệu từ Data Reader 
Thiết lập thuộc tính 
Gọi phương thức DataBind 
Id.DataSource = dr; 
dgEmp.DataBind(); 
Thuộc tính 
Mô tả 
DataSource 
Nguồn dữ liệu 
DataTextField 
Field trong DataTable được hiển thị 
DataValueField 
Field trong DataTable trở thành giá trị của item 
Minh họa: Điều khiển DataGrid 
Sử dụng AutoFormat 
Thiết lập Tiêu đề cột 
Phân trang 
Sắp xếp 
OleDb Server 2000 
DataSet 
DataTable 
DataTable 
Thiết bị lưu trữ 
OleDb Database 
OleDbDataAdapter 
OleDbConnection 
DataTable 
Bộ nhớ 
OleDbDataAdapter 
OleDbConnection 
Dataset là gì? 
Truy cập dữ liệu với ADO.NET 
Database 
Trả DataSet cho Client 
Client thao tác dữ liệu 
Tạo đối tượng kết nối OleDbConnection và OleDbDataAdapter 
Điền dữ liệu vào DataSet từ DataAdapter, đóng kết nối 
OleDbDataAdapter 
OleDbConnection 
List-Bound Control 
Yêu cầu từ Client 
1 
2 
3 
4 
5 
Cập nhật DataSet 
Sử dụng OleDbDataAdapter để mở OleDbConnection, cập nhật cơ sở dữ liệu và đóng kết nối 
6 
7 
Client 
Web server 
DataSet