Có nhiều cách để cập nhật dữ liệu, với cách sử dụng các điều khiển lưới là một trong những cách được các nhà lập trình web hay sử dụng. Trong hình sau cho phép người sử dụng cập nhật dữ liệu từ Data grid control bằng cách chọn vào biểu tượng cây viết. Khi click và biểu tượng này thì các điều khiển Textbox tương ứng với các trường xuất hiện như sau:.
Hình 3.5. Kết quả thực hiện click Edit trong trang vidu3_2.aspx
Để trình bày được dữ liệu như hình trên ta thực hiện khai báo thủ tục BindGrid() truy xuất dữ liệu từ CSDL như sau:
Sub BindGrid()
Dim myDataView As DataView Dim myDataSet As New DataSet() Dim strConn, strSQL As String
strConn = ConfigurationManager.AppSettings("Conn") Dim myConn As New SqlConnection(strConn)
strSQL = "SELECT UserName, Password, Address From Accounts" Dim myDataAdapter As New SqlDataAdapter()
74
myDataAdapter.SelectCommand = New SqlCommand() myDataAdapter.SelectCommand.Connection = myConn myDataAdapter.SelectCommand.CommandText = strSQL myDataAdapter.SelectCommand.CommandType = CommandType.Text myConn.Open() myDataAdapter.Fill(myDataSet, "tblAccounts") myConn.Close()
myDataView = New DataView(myDataSet.Tables("tblAccounts")) myDataView.Sort = "UserName"
Me.ItemsGrid.DataSource = myDataView Me.ItemsGrid.DataBind() End Sub
Để kích hoạt dữ liệu trước hết ta khai báo điều khiển DataGrid: <asp:DataGrid id="ItemsGrid" BorderColor="black" BorderWidth="1"
CellPadding="3" OnEditCommand="ItemsGrid_Edit" OnCancelCommand="ItemsGrid_Cancel"
OnUpdateCommand="ItemsGrid_Update"
OnItemCommand="ItemsGrid_Command" AutoGenerateColumns="false" runat="server">
<HeaderStyle BackColor="CornflowerBlue"> </HeaderStyle> <Columns>
<asp:EditCommandColumn
EditText="<IMG SRC='Images/icon_edit.gif' border=0/>" CancelText="Cancel"
UpdateText="Update" HeaderText="Edit item">
<ItemStyle Wrap="False"> </ItemStyle> <HeaderStyle Wrap="False"></HeaderStyle> </asp:EditCommandColumn>
<asp:ButtonColumn HeaderText="Delete item" ButtonType="LinkButton" Text= "<IMG src='Images/icon_delete.gif' border=0/>"
CommandName="Delete"/>
<asp:BoundColumn HeaderText="UserName" ReadOnly="True" DataField="UserName"/>
<asp:BoundColumn HeaderText="Password" DataField="Password"/> <asp:BoundColumn HeaderText="Address" DataField="Address" /> </Columns>
</asp:DataGrid>
Và khai báo các thủ tục:
- Thủ tục ItemsGrid_Edit trên sự kiện OnEditCommand của điều khiển Datagrid. Thủ tục này thiết lập thuộc tính EditItemIndex đến chỉ số của phần tử được chọn.
Sub ItemsGrid_Edit(sender As Object, e As DataGridCommandEventArgs)
ItemsGrid.EditItemIndex = e.Item.ItemIndex BindGrid()
75
- Thủ tục ItemsGrid_Cancel trên sự kiện OnCancelCommand của điều khiển Datagrid. Thủ tục này thiết lập thuộc tính EditItemIndex =-1 để kết thúc trạng thái Edit.
Sub ItemsGrid_Cancel(sender As Object, e As DataGridCommandEventArgs)
ItemsGrid.EditItemIndex = -1 BindGrid()
End Sub
- Thủ tục ItemsGrid_Update trên sự kiện OnUpdateCommand của điều khiển Datagrid. Thủ tục này truy xuất vào các điều khiển Textbox để lấy các giá trị cần Update (các điều khiển này nằm ở vị trí thứ nhất trong tập các điều khiển của cell) và sử dụng các đối tượng của ADO.NET để cập nhật dữ liệu về cơ sở dữ liệu.
Sub ItemsGrid_Update(sender As Object, e As DataGridCommandEventArgs)
Dim PassText As TextBox = CType(e.Item.Cells(3).Controls(0), TextBox) Dim AddText As TextBox = CType(e.Item.Cells(4).Controls(0), TextBox) Dim txt_UserName As String = e.Item.Cells(2).Text
Dim txt_Password As String = PassText.Text Dim txt_Address As String = AddText.Text Dim myConn As SqlConnection
Dim MyCommand As SqlCommand
Dim strConn As String = ConfigurationManager.AppSettings("Conn") Dim strUpdate As String
strUpdate = " UPDATE Accounts SET Password =@Password, Address =@Address WHERE UserName=@UserName"
myConn = New SqlConnection(strConn) myConn.Open()
MyCommand = New SqlCommand(strUpdate, myConn)
MyCommand.Parameters.AddWithValue("@UserName",
txt_UserName) MyCommand.Parameters.AddWithValue("@Password", txt_Password) MyCommand.Parameters.AddWithValue("@Address", txt_Address) MyCommand.CommandType = CommandType.Text
MyCommand.ExecuteNonQuery() myConn.Close()
ItemsGrid.EditItemIndex = -1 BindGrid()
End Sub