How to: Allow Users to Delete Items in DataList Web Server Controls

Article
10/15/2014

You can allow users to delete items in a DataList control in a variety of ways. One way is to include a Delete button in an item and to delete that item immediately when the user clicks it.

Another way is to include a check box in individual items. Users can then check all the items they want to remove and then click a separate Delete button to delete them in a batch. This method is used in programs such as MSN Hotmail.

To allow users to delete individual items

Add a data source control to the page.
Define the delete command or method for the data source control.

For example, if you are using a SqlDataSource control, set the data source control's DeleteCommand property to a SQL Delete statement that includes a placeholder for the ID, as in the following example:
```
DELETE FROM Categories WHERE CategoryID = @CategoryID
```
If you are using an ObjectDataSource control, set the DeleteMethod property to the name of a method that performs the deletion.

In the data source control, create an entry for the DeleteParameters property that includes a single parameter for the ID of the record to delete.

For example, a SqlDataSource element might look like the following:

<asp:SqlDataSource ID="SqlDataSource1" 
    Runat="server" 
    ConnectionString=
        "<%$ ConnectionStrings:NorthwindConnectionString %>"
    DeleteCommand="DELETE FROM [Categories] 
        WHERE [CategoryID] = @CategoryID">
    <DeleteParameters>
        <asp:Parameter Type="Int32" 
              Name="CategoryID">
        </asp:Parameter>
    </DeleteParameters>
</asp:SqlDataSource>

Note
Other commands, such as the SelectCommand and UpdateCommand are not shown in the example.

An ObjectDataSource element might look like the following:

<asp:ObjectDataSource ID="ObjectDataSource1" Runat="server" 
        DeleteMethod="DeleteCategory()">
    <DeleteParameters>
        <asp:Parameter Name="example"></asp:Parameter>
    </DeleteParameters>
</asp:ObjectDataSource>

In the DataList control, set the DataKeyField property to the primary key of the table you want to delete records from.
In the ItemTemplate (and AlternatingItemTemplate, if you are using it), add a Button or LinkButton Web server control.

Set the CommandName property for the button to delete.

The markup for the DataList control element might look like the following:

<asp:DataList ID="DataList1" Runat="server" 
    DataSourceID="SqlDataSource1" 
    DataKeyField="CategoryID" 
    OnDeleteCommand="DataList1_DeleteCommand">
    <ItemTemplate>
       CategoryName: <asp:Label ID="CategoryNameLabel" 
                          Runat="server" 
                          Text='<%# Eval("CategoryName") %>'>
                     </asp:Label>
       <br />
       Description: <asp:Label ID="DescriptionLabel" 
                         Runat="server" 
                          Text='<%# Eval("Description") %>'>
                    </asp:Label>
      <br />
      <asp:Button ID="Delete" Runat="server" 
           Text="Delete" 
           CommandName="delete" />
    </ItemTemplate>
</asp:DataList>

Create an event handler for the DataList control's DeleteCommand event. In the method:

Get the ID of the record to delete from the DataList control's DataKeys collection. You can get the key for the current record using the index returned by the ItemIndex property of the current item.
Set the DefaultValue property of the parameter you created in step 3.
Call the data source control's Delete method.

The following code illustrates these tasks, using a SqlDataSource control named SqlDataSource1 as the data source:

Protected Sub DataList1_DeleteCommand(ByVal source As Object, 
        ByVal e As DataListCommandEventArgs)
    Dim id As Integer = _
        CInt(DataList1.DataKeys(e.Item.ItemIndex))
    SqlDataSource1.DeleteParameters("CategoryID").DefaultValue _
         = id
    SqlDataSource1.Delete()
End Sub

protected void DataList1_DeleteCommand(object source, 
    DataListCommandEventArgs e)
{
    int id = (int)DataList1.DataKeys[e.Item.ItemIndex];
    SqlDataSource1.DeleteParameters["CategoryID"].DefaultValue 
        = id;
    SqlDataSource1.Delete();
}

To allow users to delete multiple items at once

Add a data source control to the page, configure its delete command or method, and create a parameter as described in the preceding procedure.
In the DataList control's ItemTemplate (and AlternatingItemTemplate , if you are using that), add a CheckBox Web server control and set its ID property to a specific name, such as "Delete." Make sure that the AutoPostBack property of the CheckBox control is set to false.
Add a Button Web server control to the page. Set the Text property to "Delete All" and the ID property to DeleteAll. This button is not added to one of the DataList templates.
Create a method for the Click event of the Delete All button. In the method:
1. Loop through the Items collection of the DataList control, extracting each item in turn.
2. Within the item, use the item's FindControl method to get the CheckBox control from Step 1 and test its Checked property.
3. If the box is checked, delete the corresponding item from the data source.
The following example shows an event handler for the DeleteAll button that deletes items in a batch using the procedure outlined above.

[Visual Basic]

[C#]

Share via

How to: Allow Users to Delete Items in DataList Web Server Controls

To allow users to delete individual items

To allow users to delete multiple items at once

See Also

Reference

Additional resources