Export (0) Print
Expand All

Allowing Users to Edit Items in a DataList Web Server Control

Visual Studio .NET 2003

You can allow users to edit individual items in the DataList Web server control. When an individual item is put into edit mode, its editable values are usually displayed in text boxes or other controls that the user can change values in.

To allow users to edit items in a DataList control

  1. Create an ItemTemplate (and AlternatingItemTemplate, if you are using that) and add a Button Web server control to it. Set the CommandName property for this button to edit (case-sensitive). For details see Creating Web Server Control Templates.
    Note   You can use a LinkButton or an ImageButton in any step that calls for a Button.
  2. Create an EditItemTemplate for the DataList control that includes the following:
    • Controls for all the values that the user can change. For example, include TextBox controls for all character and numeric data. Use the DataBinding property to set the data source for these controls. For information, see Data Access in Web Forms Pages.
    • A Button control with the Text property "Update" whose CommandName property is set to update (case-sensitive).
    • A Button control with the Text property "Cancel" whose CommandName property is set to cancel (case-sensitive).

      The Update button will allow users to specify that they are finished editing. The Cancel button will allow them to quit editing without saving changes.

  3. Create an event handler for the control's EditCommand event. For details, see Creating Event Handlers in Web Forms Pages. In the event handler, do the following:
    1. Set the DataList control's EditItemIndex property to the index value of the item to put into edit mode. The index of the item the user clicked is available via the Item object's ItemIndex property.
    2. Bind the control to its data source.

      The event handler might look like the following:

      ' Visual Basic
      Private Sub DataList1_EditCommand(ByVal source As Object, _
      ByVal e As System.Web.UI.WebControls.DataListCommandEventArgs) _
      Handles DataList1.EditCommand
         DataList1.EditItemIndex = e.Item.ItemIndex
         DataList1.DataBind()
      End Sub
      
      // C#
      private void DataList1_EditCommand(object source,
      System.Web.UI.WebControls.DataListCommandEventArgs e)
      {
         DataList1.EditItemIndex = e.Item.ItemIndex;
         DataList1.DataBind();
      }
      
  4. Create a method for the UpdateCommand event that reads the values of the editing controls in the current item and writes them back to the data source. To get the value of a specific control in the item, use the Control.FindControl method of the Item event-argument object. After updating the data source, switch the item out of editing mode by setting the EditItemIndex property to -1, and then rebind to the data source.
    Security Note   User input in a Web Forms page can include potentially malicious client script. By default, the Web Forms page validates that user input does not include script or HTML elements. For more information, see Scripting Exploits and Protecting Against Script Exploits in a Web Application.
    ' Visual Basic
    Private Sub DataList1_UpdateCommand(ByVal source As Object, _
    ByVal e As System.Web.UI.WebControls.DataListCommandEventArgs) _
    Handles DataList1.UpdateCommand
       Dim quantity As TextBox
       quantity = CType(e.Item.FindControl("quantity"), TextBox)
       Dim newQuantity As String = quantity.Text
       ' Add code here to update the Quantity value of the data source
       ' using the newQuantity variable. Note that newQuantity is a 
       ' string and would have to be converted to a number.
       DataList1.EditItemIndex = -1
       DataList1.DataBind()
    End Sub
    
    // C#
    private void DataList1_UpdateCommand(object source, 
    System.Web.UI.WebControls.DataListCommandEventArgs e)
    {
       TextBox quantity;
       quantity = (TextBox)(e.Item.FindControl("Quantity"));
       string newQuantity = quantity.Text;
       // Add code here to update the Quantity value of the data source
       // using the newQuantity variable. Note taht newQuantity is a
       // string and would have to be converted to a number.
       DataList1.EditItemIndex = -1;
       DataList1.DataBind();
    }
    
  5. Create a method for the CancelCommand event that sets the EditItemIndex property to -1 and then rebinds to the data source:
    ' Visual Basic
    Private Sub DataList1_CancelCommand(ByVal source As Object, _
    ByVal e As System.Web.UI.WebControls.DataListCommandEventArgs) _
    Handles DataList1.CancelCommand
       ' Switch out of edit mode.
       DataList1.EditItemIndex = -1
       DataList1.DataBind()
    End Sub
    
    // C#
    private void DataList1_CancelCommand(object source, 
    System.Web.UI.WebControls.DataListCommandEventArgs e)
    {
       // Switch out of edit mode.
       DataList1.EditItemIndex = -1;
       DataList1.DataBind();
    }
    

See Also

Introduction to the DataList Web Server Control | Allowing Users to Delete Items in a DataList Web Server Control | Allowing Users to Select Items in a DataList Web Server Control | Creating Event Handlers in Web Forms Pages | Responding to Button Events in DataList, Repeater, or DataGrid Items

Show:
© 2014 Microsoft