Export (0) Print
Expand All

Allowing Users to Delete Items in a DataGrid Web Server Control

Visual Studio .NET 2003

You can set up your DataGrid so that a user can delete a particular row by clicking a button. There are three ways to create a Delete button. You can:

  • Have the Property Builder create the Delete button
  • Create the button yourself in the Property Builder
  • Add the button to a template column

In each case, you create a button control that has "Delete" as the CommandName property. Then you add code to the DeleteCommand event to delete the item from the data source.

To have the Property Builder create a Delete button

  1. Add a DataGrid to your Web Forms page. For more information, see Adding DataGrid Web Server Controls to a Web Forms Page.
  2. In Design view, select the DataGrid control, then click the Property Builder link at the bottom of the Properties window.
  3. In the DataGrid Properties dialog box, click the Columns tab.
  4. In the Available columns box, expand the Button Column item and choose Delete.
  5. Click the Add button (Aa984287.vxadd(en-us,VS.71).gif) to add the Delete column to the Selected Columns list.
  6. The Command name property for the button is Delete. You must leave this property set to Delete if you want the click to raise the DeleteCommand event.
  7. Set the rest of the button's properties as you want. For details about setting properties for button columns, see Adding Button Columns to a DataGrid Web Server Control.
  8. Add code to the DeleteCommand event handler to delete the row from the data source and rebind the data to the DataGrid. See the section, "To delete the item from the data source."

To create a Delete button using the Property Builder

  1. Add a DataGrid to your Web Forms page. For more information, see Adding DataGrid Web Server Controls to a Web Forms Page.
  2. In Design view, select the DataGrid control, then click the Property Builder link at the bottom of the Properties window.
  3. In the DataGrid Properties dialog box, click the Columns tab.
  4. In the Available columns box, select the Button Column item.
  5. Click the Add (Aa984287.vxadd(en-us,VS.71).gif) button to add the Button column to the Selected Columns list.
  6. Set the Command name property to Delete.
  7. Set the rest of the buttons as you want. For details about setting properties for button columns, see Adding Button Columns to a DataGrid Web Server Control.
  8. Add code to the DeleteCommand event handler to delete the row from the data source and rebind the data to the DataGrid. See the section below, "To delete the item from the data source."

To add a Delete button to a template column

  1. Add a template column to your DataGrid. For information, see Adding Template Columns to a DataGrid Web Server Control.
  2. In Design view, right-click the DataGrid and select Edit Template. Choose the template to which you want to add a Delete button.
  3. Add a Button, ImageButton, or LinkButton control to the ItemTemplate.
  4. Set the CommandName property of the button control to Delete.
  5. Add code to the DeleteCommand event handler to delete the row from the data source and rebind the data to the DataGrid. See the following section, "To delete the item from the data source."

To delete the item from the data source

  1. Create an event handler for the control's DeleteCommand event. For more information, see Creating Event Handlers in Web Forms Pages.
  2. In the event handler, use the e.Item.ItemIndex property to identify the row to be deleted. Delete the row from the data source and rebind the data to the control. The code could look similar to the following:
    ' Visual Basic
    Private Sub DataGrid1_DeleteCommand(ByVal source As Object, _
    ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs) _
    Handles DataGrid1.DeleteCommand
       Dim index As Integer
       index = e.Item.ItemIndex
       ' Add code to delete data from data source.
       DataGrid1.DataBind()
    End Sub
    
    // C#
    private void DataGrid1_DeleteCommand(object source, 
    System.Web.UI.WebControls.DataGridCommandEventArgs e)
    {
       int rowToDelete = e.Item.ItemIndex;
       // Add code to delete row from data source.
       DataGrid1.DataBind();
    }
    

See Also

Adding DataGrid Web Server Controls to a Web Forms Page | DataGrid Web Server Control | Introduction to the DataGrid Web Server Control | Allowing Users to Select Items in a DataGrid Web Server Control

Show:
© 2014 Microsoft