Galera é o seguinte, estou fazendo um grid com barras de rolagem porem algumas colunas eu queria deixar fixas na rolagem horizontal
esse grid tem a primeira coluna fixa e as outras colunas eu crio dinamicamente
o meu problema é que o meu grid fica dentro de uma div e um panel, mas quando eu tento fixar a primeira coluna, ela estoura o tamanho do div e acaba desconfigurando toda a página
abaixo um exemplo do código que estou usando:
<asp:Panel ID="pnNF" runat="server" GroupingText="Grid Com Barra de Rolagem"
CssClass="PanelGrid">
<div class="DivGrid" style="overflow: auto; font-family: Verdana; font-size: 10px;">
<asp:GridView ID="grdMeuGrid" runat="server"
BackColor="White" CssClass="TamahoGrid"
BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="3"
EmptyDataText="Não há informações a serem exibidas"
onrowdeleting="grdMeuGrid_RowDeleting"
onrowdatabound="grdMeuGrid_RowDataBound" ShowFooter="True"
AutoGenerateColumns="False">
<RowStyle ForeColor="#000066" />
<Columns>
<asp:TemplateField HeaderText="Nota Fiscal" FooterText="Total">
<ItemTemplate>
<asp:TextBox ID="txtColunaNf" runat="server" MaxLength="10" Text='<%# Bind("Coluna_NF") %>'
ToolTip="Digite o numéro da nota fiscal"
CssClass="TamnhoCampoGrid" Width="75px" ></asp:TextBox>
</ItemTemplate>
<FooterStyle HorizontalAlign="Center" />
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="#006699" ForeColor="White"
BorderWidth="1px" CssClass="FixaFooter" />
<PagerStyle BackColor="White" ForeColor="#000066" HorizontalAlign="Left" />
<SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#006699" Font-Bold="True" ForeColor="White"
CssClass="FixaHeader" />
</asp:GridView>
</div>
</asp:Panel>
Aqui os CSS que fazem o controle do tamanho do grid, da barra de rolagem do grid e de tentar fixar a coluna
.DivGrid
{
height: 220px;
width: 1030px;
}
.PanelGrid
{
height: 240px;
width: 1040px;
}
.TamahoGrid
{
font-family: Verdana;
font-size: 9px;
height: 90px;
width: 1110px;
}
Aqui é onde eu fixo a coluna, cabeçalho e rodapé:
.FixaHeader
{
position: relative;
}
.FixaFooter
{
font-weight:bold; position:relative;
bottom: expression(getScrollBottom(this.parentNode.parentNode.parentNode.parentNode));
}
.FixaColuna
{
position: relative;
}
Aqui é o código onde eu populo o grid
public DataTable PopulaGrid()
{
try
{
tabela.Columns.Add(new DataColumn("Coluna_NF", Type.GetType("System.String")));
for (int i = 1; i <= 25; i++)
{
DataRow novalinha = null; // adiciona algumas linhas em branco
novalinha = tabela.NewRow();
novalinha[0] = "";
tabela.Rows.Add(novalinha);
}
return tabela;
}
catch (Exception ex)
{
throw new Exception(ex.Message);
}
}
protected void btPopulaGrid_Click(object sender, EventArgs e)
{
try
{
// posso colocar dentro do metodo que popula o grido ou no evento databound
this.grdMeuGrid.Columns[0].ItemStyle.CssClass = "FixaColuna";
this.MeuGrid.DataSource = PopulaGrid();
this.MeuGrid.DataBind();
}
catch (Exception ex)
{
ScriptManager.RegisterStartupScript(Page, Page.GetType(), Guid.NewGuid().ToString(), "alert('" + ex.Message + "');", true);
}
}