msdn18_capa.gif

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

 

Navegação no DataGrid

por Dino Esposito

Este artigo discute

Este artigo usa as seguintes tecnologias:

·          Explorar o controle Datagrid

·          Deslocamento de registros no Datagrid

NET Framework, ASP.NET 1.1

 

Download:

CuttingEdge0503.exe (136KB)

Chapéu

Datagrid

 

 

Imagine abrir sua Inbox numa manhã e encontrar uma mensagem que diz "Caro Sr. DataGrid, preciso urgente de um DataGrid ASP.NET que permita que meus usuários movam as linhas no cliente. Você é minha última esperança. Por favor, ajude-me!"

Você não daria o melhor de si para responder a tamanho apelo? Quando recebi a mensagem em questão, indiquei ao autor meu artigo publicado na MSDN Magazine Brasil número 17, na qual descrevia como aprimorar um DataGrid ASP.NET para arrastar as colunas e classificar as linhas exibidas no cliente. Tal solução foi criada em cima dos comportamentos do DHTML. Apesar de internamente ela ser script puro, um comportamento DHTML é na verdade mais que isso. Ele adiciona orientação de objeto a um JavaScript sem formatação e permite que você exponha propriedades e métodos para acionar virtualmente qualquer elemento HTML no lado cliente.

No entanto, como meu colega programador em apuros não sabia solucionar esse problema, era hora do Sr. DataGrid entrar em ação (sim, como um herói de revistas em quadrinho). Assim nasceu este artigo — mais que um registro de como o problema específico foi solucionado, ela também é uma fiscalizadora do processo de desenvolvimento de controle e de seu funcionamento no ASP.NET 2.0.

 

O Comportamento do DHTM RowOver

O arquivo RowOver.htc é parte do Microsoft® Internet Explorer DHTML Behavior Library, uma coleção de componentes livres para funcionalidades clientes avançadas (rowover Behavior - http://msdn.microsoft.com/library/default.asp?url=/workshop/author/behaviors/library/rowover/rowover.asp). Projetado especificamente para o Internet Explorer versão 5.0 e superior, os comportamentos adicionam efeitos interativos a páginas da Web e fornecem maneiras de encapsular o script e reutilizar o código. Aplicar um comportamento a um elemento HTML é tão fácil quanto anexar um estilo. Em sua versão original, o comportamento RowOver.htc adiciona sombreamento e realce de linha alternativos aos elementos da tabela:

       ID="grid" Selectable="true">

...

 

O atributo Selectable refere-se a uma propriedade public exposta pelo comportamento RowOver. Um comportamento também pode ser anexado ininterruptamente aos controles ASP.NET, e as seguintes linhas de código adicionam um estilo à saída de um DataGrid:

     Style="BEHAVIOR:url(rowover.htc)"

     Selectable="true" />

 

Na Figura 1, a saída comum do DataGrid é estendida com realce e seleção de linha. A linha abaixo do mouse é rastreada à medida que você se move na tabela e é exibida com um conjunto diferente de atributos gráficos. Além disso, quando você clica em uma linha realçada, a linha é rastreada conforme selecionada. É importante observar que tudo isso ocorre no cliente, sem nenhum postback para o servidor.

 

image001.gif

Figura 1 DataGrid Comum

 

Embora isso tudo pareça ótimo, quando começar a testar o recurso de forma mais aprofundada, você descobrirá vários obstáculos no comportamento RowOver que o impedem de solucionar o problema manualmente.

 

Então, O que Está Errado com o RowOver?

O recurso de realce de linha seleciona todas as linhas de tabela encontradas, incluindo a legenda e as linhas de cabeçalho e rodapé, e não existe nenhuma maneira de obter o índice da linha selecionada no momento. Além disso, o comportamento de RowOver não foi projetado para mover as linhas para cima e para baixo depois que o usuário clica nos botões do cliente, mas o objetivo final de meu amigo era obter uma lista de linhas que pudessem ser ordenadas (movidas para cima e para baixo) por meio dos botões no lado cliente e, em seguida, postadas para o servidor.

A solução é criar um controle DataGrid personalizado e implementar o IpostBackDataHandler, mas antes de fazer isso, vou aprimorar o comportamento RowOver.htc original para fazer com que ele suporte movimentos de linha. Em seguida, criarei um controle DataGrid que retorna uma tabela mais bem formada com tags THEAD, TBODY e TFOOT. Esse controle personalizado implementa o IPostBackDataHandler e faz o transporte de ida e de volta dos dados usando seu próprio campo oculto. Vamos começar analisando as melhorias do comportamento.

 

O Comportamento Mover

Meu novo comportamento Mover.htc é diferente de RowOver.htc em várias fontes. Mover.htc não tem nenhum dos códigos originais que faz o sombreamento da linha. Se quiser alternar as cores da linha, é melhor você usar os estilos de DataGrid. (O código-fonte RowOver original data de 1999, antes do surgimento do ASP.NET.)

Internamente, RowOver.htc rastreia a linha selecionada e armazena uma referência a ele em uma variável interna. No entanto, o comportamento não tem uma variável pública para ler o índice desta linha:

 

...

Quer ler esse conteúdo completo? Tenha acesso completo