Scrolling of a datagrid

Discussion in 'ASP .Net Web Controls' started by Sumit, Nov 15, 2003.

  1. Sumit

    Sumit Guest

    Hi,
    I want to make a datagrid to be scrollable instead of
    paging in it. So i have out that datagrid html tags inside
    <div></div> tags and made that div scrollable.
    Due to this if i scroll down the datagrid,,header also
    gets off the view because that header is also considered
    as a row in datagrid!!
    I want datagrid to be scrollable but header of the
    datagrid should always be there.
    Please suggest,
    Thanks
    Sumit, Nov 15, 2003
    #1
    1. Advertising

  2. Sumit

    Oliver Guest

    Creating a Scrollable DataGrid with a Fixed Header
    By: Scott Mitchell

    http://datawebcontrols.com/faqs/CustomizingAppearance/ScrollableDataGridWithFixedHeader.shtml

    "Sumit" <> wrote in message
    news:00f701c3ab50$2280ddf0$...
    > Hi,
    > I want to make a datagrid to be scrollable instead of
    > paging in it. So i have out that datagrid html tags inside
    > <div></div> tags and made that div scrollable.
    > Due to this if i scroll down the datagrid,,header also
    > gets off the view because that header is also considered
    > as a row in datagrid!!
    > I want datagrid to be scrollable but header of the
    > datagrid should always be there.
    > Please suggest,
    > Thanks
    Oliver, Nov 15, 2003
    #2
    1. Advertising

  3. Sumit

    sumit Guest

    Hi,

    That articles talks about creating an html table,,
    but i need to have sorting facility as well in that header
    rows and also data grid will have hori. scroll bar in
    it,,so moving data grid scroll bar horizontally,,upper
    html table should also also get scrolled,,,and no
    horizontal bar should be shown in the header html table!!

    Please suugest me or send me the code if anyone can as it
    is required very urgent!!

    Thanks
    >-----Original Message-----
    >Creating a Scrollable DataGrid with a Fixed Header
    >By: Scott Mitchell
    >
    >http://datawebcontrols.com/faqs/CustomizingAppearance/Scro

    llableDataGridWithFixedHeader.shtml
    >
    >"Sumit" <> wrote in message
    >news:00f701c3ab50$2280ddf0$...
    >> Hi,
    >> I want to make a datagrid to be scrollable instead of
    >> paging in it. So i have out that datagrid html tags

    inside
    >> <div></div> tags and made that div scrollable.
    >> Due to this if i scroll down the datagrid,,header also
    >> gets off the view because that header is also considered
    >> as a row in datagrid!!
    >> I want datagrid to be scrollable but header of the
    >> datagrid should always be there.
    >> Please suggest,
    >> Thanks

    >
    >
    >.
    >`
    sumit, Nov 16, 2003
    #3
  4. there's a few solutions, here's one that I devised. As far as I know, no
    matter what, you'll essentially need two tables or grids. one for the
    header and one for the body. You basically need to hide the header row from
    your datagrid, and create a new table/grid with the header information.
    Here is my solution which consists of two files. An external .css file and
    the .aspx page

    In an external .css file (I used GlobalStyles.css):

    ..divHeader
    {
    height: 30;
    width: 100%;
    overflow: hidden;
    }

    ..tblHeader
    {
    height: 30;
    width: 100%;
    overflow: hidden;
    }

    ..divBody
    {
    width: 100%;
    height: 590;
    overflow: auto;
    }

    ..tblBody
    {
    width:100%;
    }

    End of external .css file.

    In the <HEAD> section of the .aspx page:
    <script>
    function GetJSObject(objID)
    {
    var myObj;

    if(document.getElementById)
    {
    myObj = document.getElementById(objID);
    }
    else if (document.layers)
    {
    myObj = document.layers[objID];
    }
    else if (document.all)
    {
    myObj = document.all(objID);
    }

    return(myObj);
    }

    function Scroll()
    {
    GetJSObject("divHeader").scrollLeft =
    GetJSObject("divBody").scrollLeft;
    }
    </script>
    <LINK href="GlobalStyles.css" type="text/css" rel="stylesheet">

    End of <HEAD> section.

    In the <BODY> section of the .aspx file:

    <div class="divHeader" id="divHeader">
    <asp:table id="tblHeader" runat="server"
    EnableViewState="False" CssClass="tblHeader"></asp:table>
    </div>
    <div class="divBody" id="divBody" onscroll="Scroll();">
    <asp:table id="tblBody" runat="server" EnableViewState="False"
    CssClass="tblBody"></asp:table>
    </div>

    End of <BODY> section.


    That's it. I used Tables, but you could use a grid as well. Populate tblBody
    however you like, then populate tblHeader with one row. That row should have
    the same number of cells stretching horizontally that a single row in
    tblBody has. This solution does require a little bit of javascript, but I
    couldn't find a solution simply using divs or any other html tag.

    "Sumit" <> wrote in message
    news:00f701c3ab50$2280ddf0$...
    > Hi,
    > I want to make a datagrid to be scrollable instead of
    > paging in it. So i have out that datagrid html tags inside
    > <div></div> tags and made that div scrollable.
    > Due to this if i scroll down the datagrid,,header also
    > gets off the view because that header is also considered
    > as a row in datagrid!!
    > I want datagrid to be scrollable but header of the
    > datagrid should always be there.
    > Please suggest,
    > Thanks
    Jeremy Chapman, Nov 19, 2003
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. abacnet

    Datagrid header and scrolling,

    abacnet, Aug 10, 2003, in forum: ASP .Net
    Replies:
    1
    Views:
    2,084
    Saravana
    Aug 11, 2003
  2. Saravana [MVP]

    Scrolling in datagrid.

    Saravana [MVP], Oct 16, 2003, in forum: ASP .Net
    Replies:
    6
    Views:
    420
    Rajesh.V
    Oct 16, 2003
  3. Bruce W...1
    Replies:
    2
    Views:
    329
    Rajesh.V
    Nov 6, 2003
  4. Ashvin Navare
    Replies:
    0
    Views:
    464
    Ashvin Navare
    Nov 16, 2003
  5. =?Utf-8?B?cm9kY2hhcg==?=

    scrolling the datagrid

    =?Utf-8?B?cm9kY2hhcg==?=, Apr 11, 2005, in forum: ASP .Net
    Replies:
    2
    Views:
    438
    =?Utf-8?B?Sm9obiBXYWxrZXI=?=
    Jun 23, 2005
Loading...

Share This Page