ASP.NET - Configurando a exibição do Datagrid

A princípio a exibição de um controle Datagrid é bem "tosca". Mas com algumas tags de formatação, a coisa pode melhorar. No exemplo do post anterior substitua a tag asp:DataGrid pelo conteúdo abaixo:

A tag HeaderStyle se refere à primeira linha (a dos títulos das colunas). Uma das falhas deste controle é não produzir tags TH para as colunas dos títulos, o que seria mais correto e de acordo com o padrão W3C. A linha de títulos é uma TR com TDs como qualquer outra linha de dados.

A tag ItemStyle se refere às demais linhas de registros da tabela. Novamente se percebe uma falha gravíssima. Cada linha tem os estilos de ItemStyle repetidos. O correto seria estes possuírem uma referência à uma classe CSS, e esta sim seria definida para fazer a formatação desejada. Falha da Microsoft.

Compatibilidade com jQuery

O jQuery (biblioteca javascript do MIT) oferece infra-estrutura para implantar uma outra biblioteca de manipulação de tabelas: o tablesorter. Como a formatação do DataGrid não obedece ao padrão W3C, a implantação de sua funcionalidade tem que ser feita utilizando o código VBscript de produção dos códigos da tabela de forma a obedecer ao W3C, o que implica em perder a formatação compacta e sucinta do DataGrid. No entanto, o tablesorter tem a vantagem de fornecer as funcionalidades em tempo de cliente, com eficiência muito maior.

ASP.NET - Exemplo de Datagrid

O Datagrid é o controle mais sintético e útil para exibir o conteúdo de tabelas de bancos de dados.

Início da Script ASPX

Carrega as bibliotecas e abre a script VB:

Declara a Subrotina Page_Load e faz as configurações de parâmetros:

* 1 * - Nome do servidor, nome do compartilhamento no servidor e nome do banco Access;
* 2 * - Nome da tabela.

A montagem da sentença SQL depende dos nomes dos campos da tabela. Na figura mostramos alguns exemplos de nomes comuns, mas você deve usar os nomes dos campos da sua tabela.

Finalizamos com as tags HTML e com a tag asp:DataGrid.

Ligando duas DIVs com um conector sem HTML5

Os gráficos e diagramas estão ganhando muita importância nas páginas Web. Estamos em um mundo essencialmente visual.

Criar retângulos, boxes e regiões retangulares com DIVs já é uma rotina nas páginas de Internet. No entanto, um aspecto do uso destas DIVs se torna um problema de geometria: a conexão com linhas. Como é que, sem o HTML5, podemos desenhar linhas de conexão ?

O diagrama do problema

Observe a figura a seguir. Ela mostra as grandezas geométricas envolvidas neste problema.

Início da página HTML:

* 1 * - A DIV da classe Conecta é um conector, ou seja, um traço. No Internet Explorer, para que o traço não acabe se tornando um retângulo com alguma altura, é preciso definir o tamanho do fonte como 1 pixel;

* 2 * - Com o mesmo intuito de *1*, garantimos que o traço não terá altura, anulando a altura da linha.

Scripts

Função javascript que cria uma DIV programaticamente (criaDiv):

É preciso usar a biblioteca jquery, que torna todas as tarefas de programação mais fáceis em torno da ponte entre as TAGS e o código javascript.

Função javascript que cria um conector - Parte I

Função javascript que cria um conector - Parte II

Função javascript que cria um conector - Parte III

O código HTML produzido é colocado dentro da DIV cujo Id é "main".

Finalização das funções

Em se tratando  de um javascript, temos que garantir que o HTML da página foi todo lido:

NÃO ESQUEÇA DE FECHAR A ÚLTIMA FUNÇÃO ABERTA COM "}".

ASP.NET - Integração com jQuery

O ASP.NET cria o seu próprio modelo de controles e de eventos. A pergunta é:

Podemos utilizar jQuery com ASP.NET ?

Sim, não existe conflito de eventos, basta colocar as coisas nos lugares certos e nos tempos corretos. Veja o exemplo:

Como o ASP.NET utiliza tags <asp:, parece que não existe o INPUT. E como precaução, prefira fazer a referência pelo ID do controle, ao invés de utilizar o nome da Tag HTML com algum atributo (Id, name). Desta forma, você evita dores de cabeça.

Primeiro programa em ASP.NET usando VB - Hello World

O VB é uma linguagem menos tipada e menos complexa que o C#. Podemos fazer classes utilizando VB, da mesma forma que em C#, no entanto elas são mais compreensíveis.

O formulário de entrada de dados é praticamente o mesmo, exceto pela definição da linguagem de programação:

Script AspNet_C_003.aspx

Biblioteca de classe AspNet_C_aspx.vb

* 1 * - Mesmo nome referenciado pelo atributo Inherits da tag "@Page";
* 2 * - Nome da rotina que trata o evento, composto de [ID do controle]_[Nome do Evento];
* 3 * - Nome da rotina, composta de [ID do controle].[Nome do Evento].

Programa básico em ASP.NET com C# - separação da classe

A forma mais estruturada de trabalhar com ASP.NET e C# é utilizar dois arquivos:

• Um com a UI (User Interface - Interface do usuário);
• Outro com as classes e funções utilizadas pela UI.

A seguir mostramos o exemplo.

Arquivo com a classe principal e funções (AspNet_C_002.aspx.cs):

* 1 * - O nome da classe é "_botao" para fins de referência ao código;

* 2 * - O nome do evento deve lembrar o nome do objeto visual, para facilitar as manutenções no código;

* 3 * - O controle cujo ID é "Texto" terá sua propriedade Text alterada;

Arquivo com a UI (Interface do usuário)(AspNet_C_002.aspx)

* 4 * - O nome do arquivo de códigos é AspNet_C_002.aspx.cs;
* 5 * - Em inherits, colocamos o nome da classe que consta no arquivo de classes e funções;
* 6 * - O nome da função que manipula o evento OnClick é Button_Click, contida em (AspNet_C_002.aspx.cs);
* 7 * - O nome do controle que terá seu texto modificado pela função Button_Click é "Texto";

Primeiro programa em ASP.NET usando C# - Hello World

Já vimos em post anterior um Hello World em ASP.NET utilizando o VBscript como linguagem de construção. Agora vamos ver o mesmo programa usando o C# como linguagem:

* 1 * - Na diretiva "Page" o programa declara que a linguagem usada é o "C#";

* 2 * - As variáveis precisam ser declaradas e tipadas;

* 3 * - O sinal de concatenação é o "+" e não o "&" como em VB.