msdn28_capa.jpg

Clique aqui para ler todos os artigos desta edição


Criando colunas dinamicamente

 

Desde o lançamento do ASP.NET, o DataGrid é um dos controles mais empregados, principalmente pela sua fácil utilização e pela quantidade de recursos que auxiliam o desenvolvedor a criar páginas robustas e atrativas. Através do Visual Studio .NET, fica ainda mais inspirador o uso do DataGrid, dada à velocidade de desenvolvimento. Com poucos cliques, tem-se acesso aos wizards que configuram as colunas (Property Builder) e o formato visual (Auto Format), restando apenas atribuir o seu DataSource, podendo ser um DataTable, coleções entre outros.

O objetivo deste artigo é mostrar a possibilidade de formatação e criação de colunas no DataGrid de forma dinâmica. É criado um projeto ASP.NET que efetua uma consulta de Produtos com suas respectivas Categorias, no banco de dados Northwind do SQL Server. Deseja-se apresentar ao usuário todos os Produtos agrupados por Categorias, com subtotais. Para isso, é utilizado como DataSource (fonte de dados) um novo DataTable criado a partir do retornado na consulta.

Talvez você esteja se perguntando: “Por que criar colunas dinamicamente, se é possível criá-las sem uma linha de código e de forma quase que instantânea utilizando o VS.NET?”. Certo? A resposta para essa pergunta pode ser melhor analisada através do seguinte questionamento: “Como fazer para que um mesmo DataGrid seja parametrizado de forma tal, que em certas situações apresente X colunas e em outras situações apresente Y colunas?”. Resposta: Criar as colunas dinamicamente, podendo também utilizar artifícios de orientação a objetos (OO) – Herança e Polimorfismo.

Para aumentar a compreensão da resposta apresentada, imagine que você queira centralizar seus relatórios em apenas uma página .aspx com apenas um DataGrid e que cada relatório tenha uma consulta SQL diferente. Uma forma viável, através de OO, é criar uma classe pai RelatorioPadrao com dois métodos: retornaColunas e retornaDados e para cada relatório a ser gerado, criar classes filhas (exemplo RelatorioProduto) que irão sobrescrever esses métodos. Desta forma, na página .aspx será instanciada a classe desejada e invocados os métodos que retornam as colunas do DataGrid e seu DataSource.

Neste artigo, para simplificar, não será modelado através de classes e subclasses. A criação das colunas, formatação do DataGrid e agrupamento com subtotais serão feitos diretamente na classe da Interface (.aspx).

Projeto

Crie um projeto ASP.NET Web Application chamado DataGridAgrupadoColunas usando como linguagem o Visual C#, contendo um formulário chamado GridAgrupadoColunas.aspx. Insira 3 controles, 1 DataGrid (id = gridProdutoCategorias), 1 Button (id = btnSelecionados ) e 1 ListBox (id = lstSelecionados).

Como sugestão de layout, veja a Figura 1. Apenas observe que são utilizadas tabelas HTML para possibilitar uma melhor organização visual.

 

image001.gif

Figura 1. Layout de interface sugerido

Para agilizar o tempo de desenvolvimento, selecione o DataGrid e formate a cor e fonte do cabeçalho, através de suas propriedades HeaderStyle. Em tempo de design não é necessário fazer mais nada.

No projeto sugerido, é realizada uma consulta ao banco de dados Northwind do SQL Server, retornando a tabela Products com sua respectiva Categories, como na Figura 2. Porém, o desejado é que os produtos sejam visualizados agrupados por categorias no DataGrid, incluindo subtotais e no final um Total Geral. Para isto, via programação, a partir da consulta original, é criado um novo DataTable no modelo final.

 

image002.png

Figura 2. Query realizada no Northwind

 

No DataGrid são criadas cinco colunas dinamicamente:

 

Nome

Tipo

Obs.

Selecionar

TemplateColumn

TemplateColumnCheckBox

Descrição

BoundColumn

 

Valor Unitário

BoundColumn

 

Quantidade Estoque

BoundColumn

 

Valor Estoque

BoundColumn

 

 

BoundColumns são colunas que se relacionam com os campos do DataSource do DataGrid em questão. TemplateColumns são colunas complexas, que permitem a inserção de diversos outros controles, como por exemplo um CheckBox. Neste caso, a coluna Selecionar possuirá um CheckBox em todas as linhas, menos nos grupos e subtotais, permitindo que o usuário informe quais produtos deseja selecionar. E quando este clicar no botão Mostrar Selecionados, os produtos em questão serão adicionados ao ListBox. Essa funcionalidade é para explicitar que mesmo sendo adicionados controles em runtime, seus valores permanecem entre PostBacks.

Precisamos então partir para o código!

Código

A primeira parte a ser desenvolvida é a criação das colunas do DataGrid, para isso no método OnInit deve ser invocada o método criaColunasGrid. A necessidade da chamada ser no OnInit (Listagem 1) é devido que neste evento os controles ainda não são preenchidos com seus dados pelo DataView.

 

Listagem 1. OnInit

override protected void OnInit(EventArgs e)

{

         InitializeComponent();

...

Quer ler esse conteúdo completo? Tenha acesso completo