Cómo: Permitir a los usuarios eliminar elementos en controles DataList de servidor Web

Actualización: noviembre 2007

Hay varias maneras de permitir que los usuarios eliminen elementos en un control DataList. Una de ellas consiste en incluir un botón Eliminar en un elemento y automáticamente eliminar dicho elemento cuando el usuario haga clic en él.

También puede incluir una casilla de verificación en elementos individuales. A continuación, los usuarios pueden activar todos los elementos que desean quitar y después hacer clic en el botón Eliminar para suprimirlos todos de una sola vez. Este método se utiliza en programas tales como MSN Hotmail.

Para permitir que los usuarios eliminen elementos individuales

  1. Agregue un control del origen de datos a la página.

  2. Defina el método o el comando de eliminación en el control del origen de datos.

    Por ejemplo, si está utilizando un control SqlDataSource, establezca la propiedad DeleteCommand del control del origen de datos en una instrucción Delete de SQL que incluya un marcador de posición para el id., como en el ejemplo siguiente:

    DELETE FROM Categories WHERE CategoryID = @CategoryID

    Si está utilizando un control ObjectDataSource, establezca la propiedad DeleteMethod en el nombre de un método que realice la operación de eliminación.

  3. En el control del origen de datos, cree una entrada para la propiedad DeleteParameters que incluya un solo parámetro para el id. del registro que se va a eliminar.

    Por ejemplo, un elemento SqlDataSource podría parecerse a lo siguiente:

    <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>
    Nota:

    Otros comandos, como SelectCommand y UpdateCommand no se muestran en el ejemplo.

    Un elemento ObjectDataSource podría parecerse a lo siguiente:

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

  4. En el control DataList, establezca la propiedad DataKeyField en la clave principal de la tabla en la que desea eliminar los registros.

  5. En la propiedad ItemTemplate (y AlternatingItemTemplate, si está utilizándola), agregue un control Button o LinkButton de servidor Web.

  6. Establezca la propiedad CommandName del botón en delete.

    El marcado del elemento de control DataList podría tener un aspecto similar a:

    <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>

  7. Cree un controlador de eventos para el evento DeleteCommand del control DataList. En el método:

    1. Obtenga el id. del registro para eliminarlo de la colección DataKeys del control DataList. Puede obtener la clave del registro actual utilizando el índice devuelto por la propiedad ItemIndex del elemento actual.

    2. Defina la propiedad DefaultValue del parámetro que creó en el paso 3.

    3. Llame al método Delete del control del origen de datos.

    En el código siguiente se muestran estas tareas, donde se utiliza un control SqlDataSource denominado SqlDataSource1 como origen de datos:

    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();
}

Para permitir que los usuarios eliminen múltiples elementos de una sola vez

  1. Agregue un control del origen de datos a la página, configure su método o comando de eliminación y cree un parámetro tal y como se ha descrito en el procedimiento anterior.

  2. En la propiedad ItemTemplate (y AlternatingItemTemplate, si está utilizándola) del control DataList, agregue un control CheckBox de servidor Web y establezca su propiedad ID en un nombre específico, como "Delete." Asegúrese de que la propiedad AutoPostBack del control CheckBox está establecida en false.

  3. Agregue un control Button de servidor Web a la página. Establezca la propiedad Text en "Eliminar todo" y la propiedad ID en DeleteAll. Este botón no se agrega a una de las plantillas DataList.

  4. Cree un método para el evento Click del botón Eliminar todo. En el método:

    1. Recorra la colección Items del control DataList para extraer de uno en uno los elementos.

    2. Dentro del elemento, utilice el método FindControl para obtener el control CheckBox del paso 1 y comprobar su propiedad Checked.

    3. Si la casilla está activada, elimine del origen de datos el elemento correspondiente.

    El ejemplo siguiente muestra un controlador de eventos para el botón DeleteAll que elimina los elementos de un lote mediante el procedimiento antes descrito.

    [Visual Basic]

[C#]

Vea también

Referencia

Información general sobre DataList (Control de servidor Web)

  • Last updated on