Criando um GridView com Barra de Rolagem e Cabeçalho Fixo

Postado por Daniel Garcia às 01:49 QUINTA-FEIRA, 16 DE JULHO DE 2009

Neste post ensinarei como inserir barra de rolagem em um GridView e também como fixar a posição do cabeçalho.

Para isso, basta executarmos três passos:

1 - Inserir a grid dentro de um DIV, habilitando sua rolagem e fixando uma altura (observe o style da DIV).

<div style="height: 150px; overflow: auto;">
     <asp:GridView ID="GridView1" runat="server">
     </asp:GridView>
</div>

Resultado:

GridView com barra de rolagem

2 - Codificar a tag <style> (CSS) da página, para fixar a posição do cabeçalho da grid.

<style type="text/css">
     .th
     {
          position: relative;
     }
</style>

3 - Imprementar o estilo na grid adicinando a tag "HeaderStyle".

<div style="height: 150px; overflow: auto;">
     <asp:GridView ID="GridView1" runat="server">
          <HeaderStyle CssClass="th" />
     </asp:GridView>
</div>

Pronto, agora você tem sua grid com rolagem e cabeçalho fixo!

4.2 ponto(s). Avaliado por 5 pessoas

  • Currently 4,2/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5

Tags:

ASP.NET

Comentários

Comentar


(Vai mostrar seu Gravatar)  

  Country flag

biuquote
  • Comentário
  • Pré-visualização
Loading



Sobre o Autor

Daniel Garcia - MCP, MCTS, MCPD
Meu nome é Daniel Garcia, venho atuando no mercado de tecnologia há mais de uma década. Durante esse tempo tive a oportunidade de trabalhar com diversas tecnologias, principalmente Microsoft. Conquistei os títulos: MCP, MCTS, MCDP e MCT. Desde então, venho contribuindo com toda a Comunidade, divulgando meu conhecimento das tecnologias Microsoft.