ASP.NET 2.0 GridView - Exclusão de Registro com Confirmação do Usuário

Neste artigo, o autor demonstra como solicitar a confirmação do usuário antes de excluir um registro do banco de dados apresentado num GridView.

por Carlos de Mattos

Tecnologias:

· C#

· JavaScript

· ASP.NET 2.0

· SQL Server 2000

Banco de Dados:

· Northwind (SQL Server)

Introdução

Apresentar registros em formato de tabela é uma das tarefas mais comuns em todos os tipos de aplicações. No ASP.NET 2.0 temos novos controles do tipo Grid (GridView e DetailsView) e suas flexibilidades nos permitem iteragir com o usuário de diversas formas. Neste exemplo, vou demonstrar como solicitar a confirmação do usuário antes de excluir um registro do banco de dados apresentado num GridView.

Criando nosso cenário

Para ilustrar meu exemplo, vou utilizar a tabela de Produtos do banco de dados Northwind do SQL Server. O primeiro passo é criar uma nova aplicação ASP.NET e adicionar ao novo WebForm um controle do tipo GridView (GridProducts) e um Label (lblError). A propriedade AutoGenerateColumns do GridView deve ser definida como False. Adicionei apenas duas colunas para este exemplo, uma delas exibirá o código do produto e a outra a descrição do produto. O Quadro 1 apresenta o código HTML completo para implementação deste GridView.

<asp:GridView ID="GridProducts" runat="server" CellPadding="4"

DataKeyNames="ProductID" ForeColor="#333333" GridLines="None"

OnRowDeleting="GridProducts_RowDeleting" AutoGenerateColumns="False"

OnRowDataBound="GridProducts_RowDataBound" OnRowCommand="GridProducts_RowCommand">

<FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />

<RowStyle BackColor="#F7F6F3" ForeColor="#333333" />

<EditRowStyle BackColor="#999999" />

<SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />

<PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />

<HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />

<AlternatingRowStyle BackColor="White" ForeColor="#284775" />

<Columns>

<asp:BoundField DataField="ProductID" HeaderText="ProductID" ReadOnly="True" />

<asp:BoundField DataField="ProductName" HeaderText="ProductName" />

<asp:TemplateField>

<ItemTemplate>

<asp:LinkButton ID="cmdDelete"

CommandArgument="<%# Eval("ProductID") %>"

CommandName="Delete" runat="server">

Delete</asp:LinkButton>

</ItemTemplate>

</asp:TemplateField>

</Columns>

</asp:GridView>

Quadro 1: Código HTML para implementar o GridView

A propriedade DataKeyNames

Através desta propriedade, o desenvolvedor pode obter ou definir a(s) coluna(s) que representa(m) a Chave Primária dos registros exibidos no GridView. Ela será utilizada em conjunto com o evento RowDeleting. Neste exemplo, seu valor foi definido como “ProductID”. A Figura 1 mostra as propriedades do GridView que foram alteradas.

Figura 1: Propriedades do GridView

As colunas do GridView

O desenvolvedor deverá adicionar duas colunas (BoundColumn) para exibição dos dados (ProductID e ProductName). Além destas colunas, será necessário a criação de uma coluna do tipo TemplateField que exibirá o botão Excluir. No exemplo, optei por um LinkButton. Seu ID foi definido como cmdDelete e duas propriedades deste botão são fundamentais para o correto funcionamento. A primeira delas é a propriedade CommandName, definida como “Delete”. Esta propriedade é utilizada em conjunto com o evento RowCommand que também será explicado neste artigo. A segunda propriedade é a CommandArgument que definiremos com o auxilio da expressão Eval(“ProductID”) conforme apresentado no Quadro 1.

Carregando o GridView

A carga deste controle pode ser feita de diversas formas, neste exemplo utilizei um DataSet como fonte de dados. O Quadro 2 arpesenta o código do procedimento LoadGridView na sua íntegra.

protected void LoadGridProducts()

{

SqlConnection cn = new SqlConnection("SERVER=(local);DATABASE=northwind;UID=sa;PWD=;");

SqlCommand cmd = new SqlCommand();

cn.Open();

cmd.Connection = cn;

cmd.CommandType = CommandType.Text;

cmd.CommandText = "select ProductID, ProductName from Products";

SqlDataAdapter da = new SqlDataAdapter(cmd);

DataSet ds = new DataSet();

da.Fill(ds, "Products");

GridProducts.DataSource = ds;

GridProducts.DataBind();

cn.Close();

}

Quadro 2: O procedimento para carga do GridView

O evento RowDataBound

A chave do funcionamento desta implementação está na manipulação do evento RowDataBound para adicionarmos o código JavaScript que solicitará a confirmação do usuário antes de executar a operação de exclusão. O evento RowDataBound é disparado sempre que uma linha é adicionada ao GridView, isto ocorre tanto quando o GridView é criado pela primeira vez e sempre que a página é recarregada. O Quadro 3 apresenta o código implementado para este evento.

protected void GridProducts_RowDataBound(object sender, GridViewRowEventArgs e)

{

if (e.Row.RowType == DataControlRowType.DataRow)

{

LinkButton MyButton = (LinkButton)e.Row.FindControl("cmdDelete");

MyButton.Attributes.Add("onclick", "javascript:return " +

"confirm("Confirma a exclusão do Produto nº " +

DataBinder.Eval(e.Row.DataItem, "ProductID") + "?")");

}

}

Quadro 3: Código do evento RowDataBound

Os eventos RowCommand e RowDeleting

O controle GridView permite que o desenvolvedor implemente procedimentos para exclusão de registros em dois eventos o RowCommand e o RowDeleting. Na verdade, o evento RowComand é disparado sempre que um botão de comando do GridView é pressionado. Seja qual for o comando associado ao botão este evento será acionado. O evento RowDeleting é disparado sempre que o comando “Delete” do GridView for invocado, mas sempre antes de efetivar a exclusão. Este evento pode ser utilizado inclusive para cancelar o processo de exclusão disparado pelo evento RowCommand. Mas isto é assunto para outro artigo. Neste exemplo vou mostrar como podemos capturar a chave do registro, ProductID, utilizando os dois eventos separadamente.

Codificando os eventos RowCommand e RowDeleting

Os Quadros 4 e 5 apresentam o código completo para os eventos RowCommand e RowDeleting respectivamente. O procedimento implementado é idêntico exceto pela forma como obtém a Chave-Primária do registro que será excluído. No evento RowCommand a Chave-Primária é obtida através do parâmetro CommandArgument alimentado na criação do GridView como mostra o Quadro 1. Já no evento RowDeleting, a Chave-Primária é obtida através da coleção DataKeys do GridView. Analise atentamente o código apresentado nos quadro abaixo.

protected void GridProducts_RowCommand(object sender, GridViewCommandEventArgs e)

{

if (e.CommandName == "Delete")

{

int ProdID = Convert.ToInt32(e.CommandArgument);

SqlConnection cn = new SqlConnection("SERVER=(local);DATABASE=northwind;UID=sa;PWD=;");

SqlCommand cmd = new SqlCommand();

try

{

cn.Open();

cmd.Connection = cn;

cmd.CommandType = CommandType.Text;

cmd.CommandText = "delete from products where productid=" + ProdID;

cmd.ExecuteNonQuery();

LoadGridProducts();

}

catch (Exception ex)

{

lblError.Text = ex.Message.ToString();

}

finally

{

cn.Close();

}

}

Quadro 4: O procedimento do evento RowCommand

protected void GridProducts_RowDeleting(object sender, GridViewDeleteEventArgs e)

{

SqlConnection cn = new SqlConnection("SERVER=(local);DATABASE=northwind;UID=sa;PWD=;");

SqlCommand cmd = new SqlCommand();

try

{

cn.Open();

cmd.Connection = cn;

cmd.CommandType = CommandType.Text;

cmd.CommandText = "delete from products where productid=" +

GridProducts.DataKeys[e.RowIndex].Value;

cmd.ExecuteNonQuery();

LoadGridProducts();

}

catch (Exception ex)

{

lblError.Text = ex.Message.ToString();

}

finally

{

cn.Close();

}

}

Quadro 5: O procedimento do evento RowDeleting

Figura 2: O exemplo em tempo de execução

Conclusão

No exemplo acima, o desenvolvedor pode acompanhar a implementação de uma rotina em JavaScript para solicitar a confirmação do usuário antes de executar uma exclusão de registros numa aplicação ASP.NET. Foi esclarecido o funcionamento dos eventos RowCommand, RowDeleting e RowDataBound, assim como o uso das propriedades DataKeys, CommandArgument e CommandName. Os controles do tipo Grid são muito flexíveis e suas aplicações práticas são as mais diversas. Implemente o exemplo acima e adpte-o para suas necessidades.