1 year ago

#385750

test-img

Ace2874

Center gridview with autogenrerate columns and js script to make header static

Need help centering the gridview on page the gridview has autogeneratecolumns I have js script to make the header static with scroll

I have only managed to get the headers being centered but not the data columns

Here is the JS

        <script src="jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="ScrollableGridViewPlugin_ASP.NetAJAXmin.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#<%=GV1.ClientID %>').Scrollable({
            ScrollHeight: 500,
            IsInUpdatePanel: false
        });
    });
</script>

The gridview code

    <form id="form1" runat="server">
        
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <div align="center" class="auto-style14">
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>

                <asp:GridView runat="server" ID="GV1" AutoGenerateColumns="true" RowStyle-Wrap="false" DataFormatString="{0:yyyy-MM-dd HH:mm}" BackColor="White" BorderColor="#999999" BorderStyle="Solid" BorderWidth="1px"  ForeColor="Black" GridLines="Vertical" RowStyle-HorizontalAlign="Center">
                <AlternatingRowStyle BackColor="#CCCCCC" />
                <FooterStyle BackColor="#CCCCCC" />
                <HeaderStyle BackColor="Maroon" Font-Bold="True" ForeColor="White" />
                <PagerStyle BackColor="#999999" ForeColor="Black" HorizontalAlign="Center" />
                <SelectedRowStyle BackColor="#000099" Font-Bold="True" ForeColor="White" />
                <SortedAscendingCellStyle BackColor="#F1F1F1" />
                <SortedAscendingHeaderStyle BackColor="#808080" />
                <SortedDescendingCellStyle BackColor="#CAC9C9" />
                <SortedDescendingHeaderStyle BackColor="#383838" />

 </asp:GridView>
          </ContentTemplate>
    </asp:UpdatePanel>                  
        </div>
            <br />
            <br />

The Styles

.auto-style14 {
   width: 100%;
   height: 500px;
   align-content: center;
   text-align: center;
   margin-left: auto;
   margin-right: auto;
}

   

c#

gridview

center

0 Answers

Your Answer

Accepted video resources