How Can We Have A SCROLLABLE GridView With Fixed Header?

一世执手 提交于 2020-01-02 09:43:49

问题


How Can We Have A SCROLLABLE GridView With Fixed Header???(in vs 2008 - asp.net with c#)

Fixed Header is my problem!

i test many ways for doing that and see some live demos / but they did not work.

can u show me a simple way 4 doing that with an example?


回答1:


two tables, one for header and one for content. only problem is that u need to set specific widths for each column.

<style>
    .tbl th { border: 1px solid black; background:#DDD; }
    .tbl td { border: 1px solid black; border-top:none }
    .scroll { height:80px; overflow-y:auto }
</style>

<table class="tbl">
    <colgroup>
        <col style="width:100px" />
        <col style="width:150px" />
    </colgroup>
    <tr>
        <th>header1</th>
        <th>header2</th>
    </tr>
 </table>

<div class="scroll">
    <table class="tbl">
        <colgroup>
            <!-- same as before -->
            <col style="width:100px" />
            <col style="width:150px" />
        </colgroup>
        <tr><td>....</td><td>...</td></tr>
        <tr><td>....</td><td>...</td></tr>
        <tr><td>....</td><td>...</td></tr>
        <tr><td>....</td><td>...</td></tr>
        <tr><td>....</td><td>...</td></tr>
        <tr><td>....</td><td>...</td></tr>
        <tr><td>....</td><td>...</td></tr>
        <tr><td>....</td><td>...</td></tr>
        <tr><td>....</td><td>...</td></tr>
    </table>
<div>
​



回答2:


This blog post might help you:

http://www.dotnetcurry.com/ShowArticle.aspx?ID=255&AspxAutoDetectCookieSupport=1

He has found a way to create fixed gridview headers and footers using a bit of jQuery. I haven't tried this myself, but judging by the comments, it works for many people.




回答3:


Following link contains jquery and gridview sorting with fixed headers

http://www.aspsnippets.com/Articles/Scrollable-GridView-with-Fixed-Headers-and-Client-Side-Sorting-using-jQuery-in-ASP.Net.aspx



来源:https://stackoverflow.com/questions/3849213/how-can-we-have-a-scrollable-gridview-with-fixed-header

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!