O controle DataGrid, sem sombra de dúvidas, é assunto para um capítulo inteiro. Como não dispomos de tanto espaço, caso contrário teríamos um livro de mais de 2000 páginas, vamos apresentar as principais características deste poderoso controle, através de alguns exemplos práticos. Neste tópico veremos como algumas propriedades e métodos do controle DataGrid, são capazes de efetuar verdadeiras maravilhas. Nos Capítulos 11 e 12 estudaremos mais sobre o controle DataGrid, principalmente sobre como fazer alterações e exclusões nos dados exibidos pelo controle.

Primeira maravilha do DataGrid: Paginação.

Quando obtemos um número grande de registros é interessante dividir a exibição do mesmo em páginas, onde exibimos um determinado número de registros por vez. Isso é o que chamamos de paginação. Por exemplo, podemos fazer com que 1000 registros sejam divididos em páginas onde são exibidos 20 registros por vez.

Fazer paginação com ASP 3.0 não era uma tarefa das mais fáceis. Um boa quantia de código era necessária e tudo tinha que ser implementado manualmente. Com o controle DataGrid, definir paginação está resumido a configurar duas propriedades:

• AllowPaging: Esta propriedade é do tipo Boleana. Se for True, a paginação é habilitada, se for False, a paginação é desabilitada. Por padrão esta propriedade é False. Ao tornarmos AllowPaging True, na última linha do DataGrid são exibidos os símbolos “<” para voltar à página anterior e “>” para ir à próxima página. Podemos alterar estes valores utilizando as propriedades PagerStyle-NextPageText para alterar o texto do link que vai para a próxima página e PagerStyle-PrevPageText, para alterar o texto do link que volta para a página anterior.

Quando estamos na primeira página, o link para a página anterior é automaticamente desabilitado, pois não existe página anterior à primeira. Quando estamos na última página, o link para a próxima página é automaticamente desabilitado, pois não existe página após a última.

• PageSize: O valor desta propriedade define o número de registros que serão exibidos , por vez. Se esta propriedade não for definida, serão exibidos 10 registros por página.

Para definir que sejam exibidos 20 registros por página, sendo “Próxima página >>”, o texto do link para a próxima página e “<< Página anterior”,o texto para o link para a página anterior, definimos as seguintes propriedades/valores do controle DataGrid:

AllowPaging="True"

PageSize=”20”

PagerStyle-NextPageText="Próxima página >>"

PagerStyle-PrevPageText="<< Página anterior"

Inserindo a definição para essas propriedades, a tag que define o controle DataGrid, ficaria da seguinte maneira:

<ASP:DataGrid 

            id="MeuDataGrid" 

runat="server"

                        Width="600"

                        BackColor="#bbccff" 

                        AllowPaging="True"

                        PageSize=”20”

                        PagerStyle-NextPageText="Próxima página  >>"

                        PagerStyle-PrevPageText="<<  Página anterior"

                 BorderColor="black"

                        ShowFooter="false" 

                        CellPadding=3 

                        CellSpacing="0"

                        Font-Name="Verdana"

                        Font-Size="8pt"

                        HeaderStyle-BackColor="#aaaadd"

                        MaintainState="false"

            />

Importante: Para que a paginação seja feita, além de definir a propriedade AllowPaging como True, temos que criar código para trocar de página. O método que faz a troca de página é definido na propriedade OnPageIndexChanged do DataGrid. Aprenderemos a implementar a paginação no Capítulo 11, onde veremos mais detalhes sobre o controle DataGrid.

Segunda maravilha do DataGrid: Mais do que um conjunto de dados na mesma página.

Vamos ver um exemplo prático,onde exibiremos dados de duas tabelas, do banco de dados NorthWind, na mesma página ASP.NET. Para isso faremos uso de dois controles do tipo DataGrid.

O exemplo Proposto: Exibir, na mesma página, informações da tabela Funcionários e da tabela Transportadores.

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

Listagem 10.7 – Exibindo dados de múltiplas tabelas em uma página ASP.NET.

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

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

<html>

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

    protected void Page_Load(Object Src, EventArgs E ) 

   {

         // 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);

           // Para podermos acessar múltiplas  tabelas vamos criar

          // um objeto Command, conforme indicado a  seguir:

            OleDbCommand  MeuComando = new OleDbCommand();

            // defino algumas  propriedades do objeto Command.

            MeuComando.Connection  = MinhaConexão;

            MeuComando.CommandType  = CommandType.Text;

            // Utilizamos um objeto  DataAdapter para executar dois comandos SQL.

            // Um comando para retornar dados da  tabela Funcionários.

            // Um comando para retornar dados da  tabela Transportadoras.

            OleDbDataAdapter MeuDataAdapter =  new OleDbDataAdapter();

         // Definimos o comando a ser utilizado pelo objeto DataAdapter.

        // Para isso definimos a sua  propriedade SelectCommand.

        MeuDataAdapter.SelectCommand =  MeuComando;

        // Criamos e preenchemos um objeto  DataSet.

       // Vamos preencher o DataSet com dados  das tabelas

       // Funcionários e Transportadores.

       // Para isso precisamos executar dois  comandos SQL.

       //  ************************************************

       // Na prática vamos chamar o método Fill  do DataAdapter

       // duas vezes.

       // Antes de cada chamada alteramos a  propriedade 

       //  CommandText do objeto Command.

       DataSet ds = new DataSet();

      MeuComando.CommandText="Select  CódigoDoFuncionário,Nome,Sobrenome,Cargo 

From Funcionários";

       MeuDataAdapter.Fill(ds,"Funcionários");

       // Altero a propriedade CommandText para  retornar dados

       // da tabela Transportadores.

       // Chamo novamente o método Fill.

       MeuComando.CommandText = "Select *  From Transportadoras";

        MeuDataAdapter.Fill(ds,"Transportadoras");

      // Conectamos um controle DataGrid com 

      // cada tabela do DataSet criado  anteriormente. 

      //  ******************************************************

      // GradeFuncionários é o id (nome) de um  controle do tipo

      // DataGrid que está na seção de  apresentação da página.

      // Este controle exibirá dados dos  Funcionários.

      //  ******************************************************

      // GradeTransportadoras é o id (nome) de  um controle do tipo

      // DataGrid que está na seção de  apresentação da página.

      // Este controle exibirá dados das  Transportadoras.

         DataView Funcionários = new DataView(ds.Tables[0]);

        GradeFuncionários.DataSource  = Funcionários ;

        GradeFuncionários.DataBind();

        DataView Transportadoras = new  DataView(ds.Tables[1]);

        GradeTransportadoras.DataSource =  Transportadoras ;

        GradeTransportadoras.DataBind();

   }

</script>

<body>

            <h3><font  face="Verdana">Funcionários da empresa North  Wind!!!</font></h3>

            <HR>

            <ASP:DataGrid 

                        id="GradeFuncionários" 

                        runat="server"

                        Width="450"

                        BackColor="#bbccff" 

                        BorderColor="blue"

                        ShowFooter="false" 

                        CellPadding=3 

                        CellSpacing="0"

                        Font-Name="Verdana"

                        Font-Size="8pt"

                        HeaderStyle-BackColor="#aaaadd"

HeaderStyle-Font-Bold="True"

                        MaintainState="false"

            />

            <BR>

            <HR>

            <h3><font  face="Verdana">Transportadoras da empresa North  Wind!!!</font></h3>

            <ASP:DataGrid 

                        id="GradeTransportadoras" 

                        runat="server"

                        Width="400"

                        BackColor="#bbddff" 

                        BorderColor="blue"

                        ShowFooter="false" 

                        CellPadding=3 

                        CellSpacing="0"

                        Font-Name="Verdana"

                        Font-Size="8pt"

                        HeaderStyle-BackColor="#aaaadd"

HeaderStyle-Font-Bold="True"

                        MaintainState="false"

            />

            <HR>

</body>

</html>

Digite o código da Listagem 10.7 e salve o mesmo em um arquivo chamado chap10ex7.aspx, na pasta chap10, 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/chap10ex7.aspx

você irá obter a página indicada na Figura 10.19.

Figura 10.19 Exibindo dados de múltiplas tabelas em uma página ASP.NET.

Observe que a listagem está classificada primeiro em ordem crescente do NúmeroDoPedido, em seguida em ordem Crescente da DataDoPedido. Vamos testar o nosso exemplo. Na primeira lista selecione PaísDeDestino e na segunda lista selecione CidadeDeDestino. Para ordem de classificação clique na opção Decrescente. Dê um clique no botão Classificar. Você obterá uma listagem classificada pelo nome de Pedidos. Parte do resultado está indicado na Figura 10.17:

Figura 10.17 Relação de Pedidos – classificada por Páis e dentro do país por Cidade.

Comentários sobre o código do exemplo – Chap10Ex6.aspx.

• Vamos descrever os passos utilizados para acessar e exibir dados das tabelas Funcionários e Pedidos. Alguns passos já foram explicados em exemplos anteriores, mas iremos repetir a explicação, para fazermos uma revisão do conteúdo deste capítulo:

1.         Utilizamos o evento Pge_Load para colocar o código necessário ao nosso exemplo.

2.         Iniciamos estabelecendo uma conexão com o banco de dados 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);

3.         A partir deste ponto temos algumas mudanças em relação aos exemplos anteriores. Primeiro vamos criar um objeto OleDbCommand e definir as propriedades Connection e CommandType do objeto OleDbCommand:

            OleDbCommand  MeuComando = new OleDbCommand();

            // defino algumas  propriedades do objeto Command.

            MeuComando.Connection =  MinhaConexão;

            MeuComando.CommandType  = CommandType.Text;

4.         Agora criamos um objeto DataAdapter e definimos a sua propriedade SelectCommand. Ao definirmos esta propriedade informamos qual o objeto OleDbCommand que estará associado ao DataAdapter:

        OleDbDataAdapter MeuDataAdapter = new  OleDbDataAdapter();

        MeuDataAdapter.SelectCommand = MeuComando;

5.         Declaramos um objeto ds do tipo DataSet. O objeto DataSet será o Container para as tabelas Funcionários e Transportadores. Recapitulando o que estudamos anteriormente, o objeto DataSet pode conter uma ou mais tabelas, as quais estão contidas na coleção Tables do objeto.

DataSet  ds = new DataSet();

6.         Chegamos ao ponto principal do nosso exemplo. Utilizamos a seguinte técnica:

            Definimos a propriedade CommandText do objeto MeuComando. Esta propriedade contém a string SQL que acessa dados de uma determinada tabela:

MeuComando.CommandText="Select  CódigoDoFuncionário,Nome,Sobrenome,Cargo 

From Funcionários";

            Em seguida chamamos o método Fill do objeto DataAdapter. Ao chamarmos este método, o comando definido na propriedade CommandText é executado e os dados retornados são passados para o DataSet definido no primeiro parâmetro. O segundo parâmetro é o nome do conjunto de dados no DataSet. No nosso exemplo utilizamos o mesmo nome da tabela, no banco de dados NorthWind, porém isso não é obrigatório:

MeuDataAdapter.Fill(ds,"Funcionários");

            Repetimos os mesmos passos para retornar dados da tabela Transportadoras e colocá-los no DataSet  ds:

 MeuComando.CommandText = "Select * From  Transportadoras";

       MeuDataAdapter.Fill(ds,"Transportadoras");

Após a execução destes comandos, a coleção Tables, do DataSet ds contém duas tabelas com dados retornados a partir do banco de dados NorthWind.mdb.

7.         O próximo passo é exibir os dados do objeto DataSet na página ASP.NET. Isto é feito utilizando um objeto do tipo DataView para cada tabela a ser exibida. Ao criarmos o objeto DataView, já passamos como parâmetro, a tabela associada ao objeto. Em seguida definimos a propriedade DataSource do controle DataGrid como sendo igual ao objeto DataView recém criado. O passo final é chamar o método DataBind do controle DataGrid:

      DataView Funcionários = new  DataView(ds.Tables[0]);

GradeFuncionários.DataSource = Funcionários ;

GradeFuncionários.DataBind();       

DataView Transportadoras = new DataView(ds.Tables[1]);

      GradeTransportadoras.DataSource =  Transportadoras ;

GradeTransportadoras.DataBind();

Para cada tabela do DataSet criamos um objeto DataView. Para o DataView Funcionários, passamos como parâmetro: ds.Tables[0], ou seja, a primeira tabela, da coleção de tabelas do DataSet ds. Para o DataView Transportadoras, passamos como parâmetro ds.Tables[1], ou seja, a segunda tabela, da coleção de tabelas do DataSet ds. Depois é só ligar cada DataView com o respectivo DataGrid.

8.         Na seção de apresentação, utilizamos algumas propriedades do DataGrid para definir a sua aparência. Por exemplo:

HeaderStyle-BackColor="#aaaadd": Define a cor de segundo plano da primeira linha do DataGrid, a linha que contém os títulos das colunas.

HeaderStyle-Font-Bold="True": Define que o texto da primeira linha deve ser exibido com fonte em negrito.

Este exemplo demonstra, mais uma vez o poder e flexibilidade dos novos objetos para acesso a dados oferecidos pelo ADO.NET e também demonstra o poder dos Web Server Controls, mais especificamente do controle DataGrid.