CODEWITHSUNDEEP
c#jqueryasp.net.net
Nithesh Narayanan
Nithesh Narayanan

Reputation: 11765

Fixed Header Gridview with scrollable body in asp.net

I have a grid-view placed inside a div and scroll bar is there. I want to set the grid view header fixed and while scrolling only the content will be scrollable. How can do this.... Thanks in Advance....

Upvotes: 0

Views: 3371

Answers (3)

Imamul Karim Tonmoy
Imamul Karim Tonmoy

Reputation: 584

in C# after gridview bind GVBrand.HeaderRow.TableSection = TableRowSection.TableHeader;

add follwoing css in gridview

    table {
        width: 100%;
    }

    thead, tbody, tr, td, th { display: block; }

    tr:after {
        content: ' ';
        display: block;
        visibility: hidden;
        clear: both;
    }

    thead th {
        height: 30px;

        /*text-align: left;*/
    }

    tbody {
        height: 120px;
        overflow-y: auto;
    }

    thead {
        /* fallback */
    }


    tbody td, thead th {
        width: 19.2%;
        float: left;
    }

http://jsfiddle.net/T9Bhm/7/

Upvotes: 1

Azhar
Azhar

Reputation: 20680

You can try IdeaSparks ASP.NET CoolControls

Upvotes: 0

Oakcool
Oakcool

Reputation: 1496

Try doing the following.

Hide the header Configure the div, so you have the side bar Add on top of the div another div, with the column names

Don't forget to fix the column sizes and have them the same as the column names on top.

Upvotes: 1

Related Questions