0

I have been handed some ASP.NET code and tasked with fixing the header and first column of the scrollable grid it contains.

I have found many, many posts on fixing headers/columns (e.g. Table fixed header and first column css/html / Html table with fixed header column and row without JS / How to freeze header and left columns of the table) but I have not been able to apply them successfully to my code. Any help you can provide would be awesome.

<asp:Content ID="Content1" ContentPlaceHolderID="bodyContent3" runat="server">
<asp:UpdatePanel ID="mainPanel" runat="server" UpdateMode="Conditional">
    <ContentTemplate>
        <asp:Panel ID="Panel1" runat="server" >
            <asp:ListView>
                <LayoutTemplate>
                    <table id="table1" class="tblstyle1">
                        <thead>
                            <tr>
                                <th>th A</th>
                                <th>th B</th>
                                <th>th C</th>
                                <th>th D</th>
                                <th>th E</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr runat="server" id="itemPlaceholder"></tr>
                        </tbody>
                    </table>
                </LayoutTemplate>

                <ItemTemplate>
                    <tr>
                        <td>td content 1</td>
                        <td>td content 2</td>
                        <td>td content 3</td>
                        <td>td content 4</td>
                        <td>td content 5</td>
                    </tr>
                    <div runat="server" id="xyz">
                        <asp:Repeater runat="server" ID="abc">
                            <HeaderTemplate>
                                <ul>
                            </HeaderTemplate>
                            <FooterTemplate></ul></FooterTemplate>
                            <ItemTemplate>
                                <li><%#:xyz %></li>
                            </ItemTemplate>
                        </asp:Repeater>
                    </div>
                </ItemTemplate>

                <EditItemTemplate>
                    <tr>
                        <td>td content 1</td>
                        <td>td content 2</td>
                        <td>td content 3</td>
                        <td>td content 4</td>
                        <td>td content 5</td>
                    </tr>
                </EditItemTemplate>

                <InsertItemTemplate>
                    <tr>
                        <td>td content 1</td>
                        <td>td content 2</td>
                        <td>td content 3</td>
                        <td>td content 4</td>
                        <td>td content 5</td>
                    </tr>
                </InsertItemTemplate>
            </asp:ListView>
        </asp:Panel></table>
    </ContentTemplate>
</asp:UpdatePanel>
</div>

Community
  • 1
  • 1
Carl
  • 1
  • 1
  • You really can't "freeze" an element that is part of a larger element. You're best off putting the table header into it's own div. Freeze that. – durbnpoisn Aug 26 '14 at 16:23
  • What do you mean by "freezing the header"? Also asp and asp.net are two different things - you shouldn't use the terms interchangeably. – Abe Miessler Aug 26 '14 at 16:24
  • Sorry for the sloppy phrasing. By 'freezing' I mean fixing the table header row and the leftmost column so they do not scroll while the rest of the table does scroll. – Carl Aug 26 '14 at 16:31
  • Tell you what, forget it. I thought this place would be helpful but all I got was snark for using the wrong terminology. I actually used 'freeze' to suggest the 'freeze panes' behaviour in Excel and convey my requirements more concisely. How stupid of me! I should have written a vague question in pidgin English. – Carl Aug 29 '14 at 08:45

0 Answers0