Conheça o Júlio Battisti

Julio Battisti - Autor de mais de 25 livros de informática Júlio Battisti tem mais de 50 livros publicados, centenas de e-books e é certificado Microsoft.

SAIBA MAIS...

Loja Virtual do Site

Curta Nossa Fanpage

« Lição anterior

Δ Página principal

¤ Capítulos

Próxima lição »

ASP.NET - CURSO COMPLETO
Autor: Júlio Battisti

Lição 095 - Capítulo 11 - Mais um pouco sobre o controle DataGrid

No Capítulo 10 mostramos algumas das capacidades do controle DataGrid, ao mesmo tempo que chamamos a atenção para o fato de ser este, um controle bastante poderoso, que nos oferece um grande número de funcionalidades. Vamos aprender, em detalhes, mais duas funcionalidades importantes do controle DataGrid:

Ordenar dados.
Filtrar dados.

Nos exemplos que iremos apresentar, vamos utilizar como fonte de dados para o controle DataGrid, um objeto DataView. Desta maneira poderemos utilizar as facilidades de ordenação e filtragem do objeto DataView, para definir quais dados e de que maneira estes dados serão exibidos no DataGrid.

Ordenação com o controle DataGrid.

O controle DataGrid possui uma propriedade chamada AllowSorting (já descrita no Capítulo 10). Quando esta propriedade é definida em True, os títulos de coluna, do controle DataGrid são transformados em Hyperlinks. Quando clicamos em um destes links ocorre um PostBack e o código definido para o evento SortCommand é executado.

Vamos construir um exemplo onde são exibidos todos os pedidos para o Brasil, a partir da tabela Pedidos do banco de dados NorthWind.mdb. Definiremos a propriedade AllowSorting do controle DataGrid para True. O passo final é criar o código que executa quando o usuário clica no título de uma das colunas. Por exemplo, se o usuário clicar na coluna CidadeDeDestino, devemos ordenar os dados pela CidadeDeDestino.

Nota: Para a criação deste exemplo, utilizaremos algumas técnicas avançadas. Todas as técnicas utilizadas serão descritas após o código do exemplo.

Na Listagem 11.7 temos o código para o exemplo proposto.

Listagem 11.7 – Ordenação com o controle DataGrid.

<%@ Import Namespace="System.Data"  %>

<%@ Import  Namespace="System.Data.OleDb" %>

<html>

<script language="C#"  runat="server">

            // Declaro uma variável do tipo String.

            //  Esta variável contém o nome da coluna pela qual

            //  faremos a ordenação.

            //  da página.

String OrdenaPor;

            //  No evento Page_Load definimos a ordenação  padrão, pelo campo

             //   NúmeroDoPedido e chamamos o procedimento – BuscaDados().

            //  A definição do campo padrão de ordenação  somente ocorre quando

            //  a página é carregada pela primeira vez, isto  é, quando não for um PostBack.

 void Page_Load(Object Src,  EventArgs E )

         if (Page.IsPostBack)

            // Não faz nada.

         else

               // Define, por padrão, a  ordenação por NúmeroDoPedido.

             OrdenaPor =  "NúmeroDoPedido";

            //  Chamo a rotina que acessa o Banco de dados e preenche o DataGrid.

        BuscaDados();

            //  Rotina que faz a conexão com o banco de dados Northwind.mdb.

            //  Ordena os dados de acordo com o campo definido na variável OrdenaPor.

void  BuscaDados()

            //  Crio uma conexão com o banco de dados do Microsoft Access.

            //  C:\Meus documentos\NorthWind.mdb.

String  DefineConexão= "PROVIDER=MICROSOFT.JET.OLEDB.4.0;" +

                                       "DATA SOURCE=c:\\meus  documentos\\NorthWind.mdb";

OleDbConnection MinhaConexão = new  OleDbConnection(DefineConexão);

            //  Utilizamos um objeto DataAdapter para executar um comando SQL,

            //  o qual retorna os pedidos para o Brasil.

OleDbDataAdapter  MeuComando = new

OleDbDataAdapter("SELECT  NúmeroDoPedido,EndereçoDoDestinatário,"

+  "Frete,CidadeDeDestino,PaísDeDestino FROM Pedidos WHERE  PaísDeDestino='Brasil'"

+  "Order By NúmeroDoPedido", MinhaConexão);

            // Criamos e preenchemos um objeto  DataSet.

DataSet ds = new DataSet();

            // Utilizo o método Fill do  objeto DataAdapter, para preencher

            // o objeto DataSet, com os dados  retornados pelo comando SQL.

MeuComando.Fill(ds);

            // Criamos um objeto DataView ligado  com a primeira

            // tabela, da coleção de tabelas, do  objeto ds.

DataView source = new DataView(ds.Tables[0]);

            // Defino a propriedade Sort, do objeto source, como  sendo

            //  igual ao valor da String OrdenaPor.

source.Sort=OrdenaPor;

            // Ligo o objeto DataView a um controle do tipo

            // DataGrid - MinhaGrade.

MinhaGrade.DataSource = source;

MinhaGrade.DataBind();

            //  Rotina que executa em resposta ao evento OnSortCommando

            //  do controle DataGrid.

            //  Esta rotina recebe dois argumentos, um do tipo Object e outro

            //  e outro do tipo DataGridSortCommandEventArgs.

void  OrdenaDados(Object sender, DataGridSortCommandEventArgs e)

         // Defino o valor da String OrdenPor,  com base na propriedade

         // SortExpression, do argumento “e”, o  qual é do tipo

         // DataGridSortCommandEventArgs, passado  como parâmetro.

OrdenaPor  = e.SortExpression.ToString();

         // Chamo a rotina que faz a conexão  para reordenar os dados,

         // com base no novo valor da String  OrdenaPor.

BuscaDados();

</script>

<body>

<h3><font  face="Verdana">Ordenação com o controle  DataGrid!!!</font></h3>

<form runat=server>

<H4>  Clique no título da coluna para ordenar pelo campo respectivo.</H4>

<HR>

                 <ASP:DataGrid

                                    id="MinhaGrade"  runat="server"

                                    Width="700"

                                    BackColor="#ccccff"

                                    BorderColor="black"

                                    ShowFooter="false"

                                    CellPadding=3

                                    CellSpacing="0"

                                    Font-Name="Verdana"

                                    Font-Size="8pt"

                                    HeaderStyle-BackColor="#aaaadd"

                                    MaintainState="false"

                                    AllowSorting="True"

                                    OnSortCommand="OrdenaDados"

/>

</form>

</body>

</html>

Digite o código da Listagem 11.7 e salve o mesmo em um arquivo chamado chap11ex7aspx, na pasta chap11, dentro da pasta wwwroot, conforme descrito no item: “Check List para acompanhar os exemplos deste livro”, no Capítulo 6.

Para acessar esta página utilize o seguinte endereço:

http://localhost/chap10/chap11ex7aspx

Você obtém uma página com todos os pedidos para o Brasil. Observe que o título das colunas é um link. Clique no título da coluna CidadeDeDestino. Observe que os dados são classificados, em ordem Crescente, pela coluna CidadeDeDestino, conforme indicado na Figura 11.8.

Curso Completo de ASP.NET - Júlio Battisti
Figura 11.8 Dados ordenados pela coluna CidadeDeDestino.

Agora dê um clique no cabeçalho da Coluna Frete e observe que os dados são classificados, em ordem crescente do valor do frete.

Comentários sobre o código do exemplo:

A primeira grande diferença que você deve ter notado em relação aos exemplos anteriores é a utilização de diversas rotinas:

1. Page_Load

2. Busca_Dados

3. OrdenaDados

Uma página ASP.NET é uma instância da classe Page. Nos vimos nos Capítulos 3, 4 e 5 que um Classe em C# pode ser composta de diversos procedimentos. Neste exemplo estamos criando três procedimentos. Não existe a definição explícita da classe, através da palavra Class. Esta é a única diferença em relação aos exemplos dos Capítulos 3, 4 e 5.

Também criamos uma variável do tipo String chamada OrdenaPor. Como esta variável foi declarada fora de qualquer procedimento, a mesma pode ser acessada em qualquer local da seção de código da página, ou seja, a variável OrdenaPor tem escopo de página:

String  OrdenaPor;

Na seção de apresentação da página, inserimos um controle do tipo DataGrid. Definimos a propriedade AllowSorting=True. Isso faz com que o cabeçalho das colunas seja exibido como um link. Na propriedade OnSortCommand, definimos o nome do procedimento que será executado quando o usuário clicar no link referente ao cabeçalho de uma coluna:

AllowSorting="True"

OnSortCommand="OrdenaDados"

Vamos entender o procedimento Page_Load:

Este evento, conforme já descrito anteriormente, é executado toda vez que a página for carregada. Quando a página for carregada pela primeira vez, a propriedade Page.IsPostBack é igual a False e, neste caso, a variável OrdenaPor é definida como sendo igual a NúmeroDoPedido.

Fora da estrutura if/else, é chamado o procedimento BuscaDados( ), ou seja, este procedimento será chamado sempre que a página for carregada, independente de ser um PostBack ou não.

Vamos entender o procedimento BuscaDados( ):

Grande parte do código deste procedimento já é de nosso conhecimento. São comandos para conectar com o banco de dados NorthWind.mdb, executar um comando SQL e retornar os dados em um objeto DataSet, a partir do qual criamos um objeto DataView. O único detalhe adicional que temos neste procedimento, é a definição da propriedade Sort, do objeto source, que é um objeto do tipo DataView:

source.Sort=OrdenaPor;

Neste momento o objeto DataView é ordenado pelo coluna, cujo nome está contido na String OrdenaPor.

O elemento principal – o procedimento OrdenaDados.

Este procedimento é executado em resposta ao evento OnSortCommand, o qual acontece toda vez que o usuário clica em um link, de uma das colunas do DataGrid. Vamos acompanhar o que acontece quando, por exemplo, o usuário clica no link da coluna CidadeDeDestino.

1. O evento OnSortCommand é disparado.

2. Em resposta ao evento OnSortCommand, o procedimento OrdenaDados é executado.

3. O procedimento OrdenaDados recebe dois argumentos. O primeiro é um argumento do tipo Object e o segundo do tipo DataGridSortCommandEventArgs. Este segundo evento tem uma propriedade chamada SortExpression, a qual retorna o nome da coluna correspondente ao link clicado pelo usuário. No nosso exemplo a expressão:

OrdenaPor = e.SortExpression.ToString();

retorna CidadeDeDestino, uma vez que o usuário clicou no link da coluna CidadeDeDestino. Com isso conseguimos detectar qual o link clicado e, consequentemente, por qual campo devemos ordenar. Uma vez definido o valor da String OrdenaPor, chamamos o método BuscaDados(), o qual retornará os dados e irá ordená-los com base no valor definido na String OrdenaPor.

Em resumo, o procedimento OrdenaDados faz o seguinte: define o valor da String OrdenaPor e chama o procedimento BuscaDados.

Nota: Para maiores informações sobre a classe DataGridSortCommandEventArgs, consulte a documentação do Framework .NET. Esta classe faz parte do namespace System.Web.UI.WebControls.

É importante salientar que a possibilidade de criar diferentes procedimentos e a possibilidade de chamarmos um procedimento, dentro do outro, nos dá uma flexibilidade muito grande. Além disso ao dividirmos o código de nossas páginas ASP.NET em procedimentos, podemos organizá-lo de uma maneira mais intuitiva, o que torna fácil a compreensão e, principalmente a manutenção do mesmo.
Observe que conhecendo os elementos (eventos, argumentos, etc) corretos, com poucas linhas de código é possível criar funcionalidades que, com ASP 3.0, exigem uma grande quantidade de código. Mais uma vez conseguimos comprovar o quão mais produtiva, do ponto de vista do desenvolvedor, é o ASP.NET em relação às versões anteriores.

Filtrando dados com o controle DataGrid.

Para filtrar os dados de um objeto DataView, utilizamos a propriedade RowFilter. Atribuímos, a esta propriedade, uma expressão de filtragem. Por exemplo, se quisermos que sejam exibidos apenas os pedidos em que o campo PaísDeDestino seja igual a Brasil, utilizamos o seguinte comando:

"PaísDeDestino  = 'Brasil'"

A expressão é a mesma que utilizaríamos em um cláusula WHERE da linguagem SQL. Podemos utilizar todos os operadores, funções e critérios válidos como critérios de filtragem.

Nota: Para maiores detalhes sobre a linguagem SQL, consulte o Anexo III.

Exemplo: Vamos apresentar um exemplo, onde destacaremos as seguintes técnicas:

Utilização de um comando SQL para retornar dados de duas tabelas.
Utilização da propriedade RowFilter, do objeto DataView, para filtrar os dados exibidos em um DataGrid.

O nosso exemplo será composto de um formulário onde temos um controle DataGrid que exibe os campos indicados na Tabela 11.2

Campo	Tabela
NúmeroDoPedido	Pedidos
NomeDaEmpresa	Clientes
CidadeDeDestino	Pedidos
PaísDeDestino	Pedidos

Tabela 11.2 Campos para o exemplo Chap11Ex8.aspx.

Observe que estamos retornando dados de duas tabelas diferentes: Pedidos e Clientes. Neste caso teremos que utilizar uma cláusula JOIN, no comando SQL. As tabelas Pedidos e Clientes são relacionadas através do campo CódigoDoCliente. Este é um relacionamento do tipo Um (tabela Clientes) para vários (tabela Pedidos), o que significa que cada Cliente é cadastrado uma única vez, porém pode fazer vários pedidos. Para maiores informações sobre relacionamentos, consulte o Anexo II. Para maiores informações sobre o SQL consulte o Anexo III.

Além do controle DataGrid, teremos um campo do tipo TextBox, onde o usuário pode digitar o nome ou parte do nome de um Cliente. Ao clicar no botão Pesquisar, o DataGrid passará a exibir somente os pedidos para os clientes, cujo nome, atende ao critério digitado.

Nota: Neste exemplo vamos manter o código que faz a classificação dos dados quando o usuário clica no título de uma das colunas do DataGrid. Desta forma poderemos filtrar e classificar os dados.

Na Listagem 11.8 temos o código para o exemplo proposto.

Listagem 11.8 – Filtragem com o controle DataGrid.

<%@ Import Namespace="System.Data"  %>

<%@ Import  Namespace="System.Data.OleDb" %>

<html>

<script language="C#"  runat="server">

//  Declaro uma variável do tipo String.

//  Esta variável contém o nome da coluna pela qual

//  faremos a ordenação.

//  Esta variável pode ser acessada em qualquer procedimento da página.

String OrdenaPor;

String FiltraDados;

void Page_Load(Object Src, EventArgs E )

         if (Page.IsPostBack)

            // Define o valor da String  FiltraDados que,

            // na prática, é a expressão de  filtragem dos dados,

            // que será atribuída à propriedade  RowFilter.

            FiltraDados="NomeDaEmpresa  LIKE '*" + DigitaCriterio.Text + "*'";

         else

            // Define, por padrão, a ordenação  por NúmeroDoPedido.

            // Atribui um valor padrão para o  campo de pesquisa.

             OrdenaPor =  "NúmeroDoPedido";

             DigitaCriterio.Text="a";

        // Chamo a rotina que acessa o Banco de  dados e preenche o DataGrid.

        BuscaDados();

   // Rotina que faz a conexão com o banco de  dados Northwind.mdb.

   // Ordena os dados de acordo com o campo  definido na variável OrdenaPor.

   // Filtra de acordo com o critério  especificado na String FiltraDados.

   void BuscaDados()

      // Crio uma conexão com o banco de dados  do Microsoft Access.

      // C:\Meus documentos\NorthWind.mdb.

      String DefineConexão=  "PROVIDER=MICROSOFT.JET.OLEDB.4.0;" +

                                       "DATA SOURCE=c:\\meus  documentos\\NorthWind.mdb";

      OleDbConnection  MinhaConexão = new OleDbConnection(DefineConexão);

       // Utilizamos um objeto DataAdapter para  executar um comando SQL,

       // o qual retorna as cidades da  Alemanha.

      String ComandoSQL;

       String aux1SQL;

      String aux2SQL;

       String aux3SQL;

       String aux4SQL;

aux1SQL= "SELECT Pedidos.NúmeroDoPedido, Clientes.NomeDaEmpresa, Pedidos.CidadeDeDestino";

aux2SQL=  ", Pedidos.PaísDeDestino FROM Clientes";

aux3SQL= " INNER JOIN Pedidos ON Clientes.CódigoDoCliente = Pedidos.CódigoDoCliente";

aux4SQL=  " ORDER BY Pedidos.NúmeroDoPedido";

       ComandoSQL = aux1SQL + aux2SQL +aux3SQL +aux4SQL;

   OleDbDataAdapter MeuComando = new  OleDbDataAdapter(ComandoSQL, MinhaConexão);

        // Criamos e preenchemos um objeto  DataSet.

        // Observe que não temos mais o objeto  Recordset,

        // como era de praxe com o ASP 3.0.

        DataSet ds = new DataSet();

        // Utilizo o método Fill do objeto  DataAdapter, para preencher

        // o objeto DataSet, com os dados  retornados pelo comando SQL.

       MeuComando.Fill(ds);

         // Criamos um objeto DataView ligado  com a primeira

         // tabela, da coleção de tabelas, do  objeto ds.

         DataView source = new DataView(ds.Tables[0]);

        // Defino a propriedade Sort, do objeto  source, como sendo

        // igual ao valor da String OrdenaPor.

       source.Sort=OrdenaPor;

       // Defino a propriedade  RowFilter, para aplicar o critério de filtragem.

       // definido na variável

       source.RowFilter=FiltraDados;

      // Ligo o objeto DataView a um controle  do tipo

      // DataGrid.

       MinhaGrade.DataSource = source;

      MinhaGrade.DataBind();

   // Rotina que executa em resposta ao evento  OnSortCommando

   // do controle DataGrid.

   void OrdenaDados(Object sender,  DataGridSortCommandEventArgs e)

         // Defino o valor da String OrdenPor,  com base na propriedade

         // SortExpression, do argumento e, do  tipo

         // DataGridSortCommandEventArgs,  passado como parâmetro.

         OrdenaPor =  e.SortExpression.ToString();

         // Chamo a rotina que faz a conexão  para reordenar os dados,

         // com base no novo valor da String  OrdenaPor.

         BuscaDados();

</script>

<body>

<h3><font  face="Verdana">Ordenação com o controle  DataGrid!!!</font></h3>

<form runat=server>

            <H4>  Clique no título da coluna para ordenar pelo campo respectivo.</H4>

            <H4> Digite o nome ou parte  do nome da empresa no campo Critério e dê um</H4>

            <H4> clique no botão  Pesquisar.</H4>

            <HR>

                <Table>

                <TR>

                   <TD> Critério --> </TD>

                   <TD>

                                    <asp:TextBox

                                    runat=server

                                    id="DigitaCriterio"

                                    Text=""

                                    Font_Face="Arial"

                                    Font_Size="3"

                                    Font-Bold="True"

                                    BackColor="lightblue"

                                    Height="20"

/>

                        </TD>

                        <TD>

                                    <asp:Button

                                               id="Pesquisar"

                                               Text="Pesquisar"

                                                runat="server"

/>

                        </TD>

                 </TR>

                 </Table>

                 <ASP:DataGrid

                                    id="MinhaGrade"  runat="server"

                                    Width="700"

                                    BackColor="#ccccff"

                                    BorderColor="black"

                                    ShowFooter="false"

                                    CellPadding=3

                                    CellSpacing="0"

                                    Font-Name="Verdana"

                                    Font-Size="8pt"

                                    HeaderStyle-BackColor="#aaaadd"

                                    MaintainState="false"

                                    AllowSorting="True"

                                    OnSortCommand="OrdenaDados"

/>

</form>

</body>

</html>

Digite o código da Listagem 11.8 e salve o mesmo em um arquivo chamado chap11ex8aspx, na pasta chap11, dentro da pasta wwwroot, conforme descrito no item: “Check List para acompanhar os exemplos deste livro”, no Capítulo 6.

Para acessar esta página utilize o seguinte endereço:

http://localhost/chap10/chap11ex8aspx

Será exibida uma página com todos os pedidos. Observe que o título das colunas é um link. Clique no título da coluna CidadeDeDestino. Observe que os dados são classificados, em ordem Crescente, pela coluna CidadeDeDestino. Clique no título da coluna NúmeroDoPedido para classificar a listagem pelo NúmeroDoPedido, conforme indicado na Figura 11.9.

Curso Completo de ASP.NET - Júlio Battisti
Figura 11.9 Todos os pedidos sendo exibidos.

Agora vamos definir um critério de Filtragem. No campo Critério digite a palavra Moreno e dê um clique no botão Pesquisar. Serão exibidos apenas os pedidos para os clientes que contém a palavra Moreno em qualquer parte do campo NomeDaEmpresa, conforme indicado na Figura 11.10. Para voltar a exibir todos os registros, apague o conteúdo do campo Critério e dê um clique no botão Pesquisar.

Curso Completo de ASP.NET - Júlio Battisti
Figura 11.10 Aplicando uma critério de filtragem.

Comentários sobre o código do exemplo Chap11ex8.aspx:

Novamente utilizamos três procedimentos.

1. Page_Load

2. Busca_Dados

3. OrdenaDados

Criamos duas variáveis do tipo String; uma para conter o nome do campo pelo qual ordenamos a listagem – OrdenaPor e outra para conter a expressão referente ao critério de Filtragem – FiltraDados:

String  OrdenaPor;

String  FiltraDados;

O controle DataGrid, na seção de apresentação, é idêntico ao controle utilizado no exemplo da Listagem 11.7.
Ao montar o comando SQL, utilizamos quatro variáveis do tipo String, depois concatenamos as quatro variáveis em uma variável chamada ComandoSQL. Esta variável foi passada como parâmetro para a criação do objeto DataAdapter:

       String ComandoSQL;

       String aux1SQL;

       String aux2SQL;

       String aux3SQL;

       String aux4SQL;

aux1SQL= "SELECT Pedidos.NúmeroDoPedido, Clientes.NomeDaEmpresa, Pedidos.CidadeDeDestino";

aux2SQL=  ", Pedidos.PaísDeDestino FROM Clientes";

aux3SQL= " INNER JOIN Pedidos ON Clientes.CódigoDoCliente  = Pedidos.CódigoDoCliente";

aux4SQL=  " ORDER BY Pedidos.NúmeroDoPedido";

ComandoSQL  = aux1SQL + aux2SQL +aux3SQL +aux4SQL;

OleDbDataAdapter  MeuComando = new OleDbDataAdapter(ComandoSQL, MinhaConexão);

Observe que fizemos uso da cláusula JOIN, pois estamos retornando dados de duas tabelas: Pedidos e Clientes. O resultado final para a string ComandoSQL é o seguinte:

SELECT  Pedidos.NúmeroDoPedido, Clientes.NomeDaEmpresa, Pedidos.CidadeDeDestino,  Pedidos.PaísDeDestino

FROM  Clientes

INNER JOIN Pedidos

ON

Clientes.CódigoDoCliente  = Pedidos.CódigoDoCliente

ORDER  BY Pedidos.NúmeroDoPedido;

Observe que estamos utilizando a nomenclatura NomeDoCampo.NomeDaTabela. Esta nomenclatura é necessária quando estamos acessando dados de duas ou mais tabelas. Com esta nomenclatura indicamos de qual tabela, determinado campo deve ser acessado. Esta nomenclatura é particularmente útil, para situações em que o mesmo nome de campo existe em duas ou mais tabelas. Por exemplo, o campo CódigoDoCliente, existe tanto na tabela Pedidos quanto na tabela Clientes.

Nota: Maiores informações sobre a linguagem SQL podem ser encontradas no Anexo III.

Vamos entender o procedimento Page_Load: