Displaying Scroll Bar for a GridView

I have a gridview which i want to display inside scroll bar. So i have enclosed it inside <div> tag and set overflow to auto and also set the <div> height:200px. So when gridview height goes above 200px the scroll bar appears right. This is working fine.

But since i set the <div> height= 200px, When gridview is empty  the page shows 200px empty space and then the other controls ( in this case Button1) appears below 200px

Here is my code

            <div style="overflow: auto; height: 200px;">
                <asp:GridView ID="gvNotes" runat="server" AutoGenerateColumns="false" OnRowCreated="gvNotes_RowCreated">
                    <Columns>
                        <asp:BoundField DataField="Note" HeaderText="Comments" />
                        <asp:BoundField DataField="CreateDate" HeaderText="Create Date" />
                        <asp:BoundField DataField="CreateUser" HeaderText="User" />
                    </Columns>
                    <EmptyDataTemplate>
                        <asp:Label ID="Label18" runat="server" Text="No comment has been added yet."></asp:Label>                    </EmptyDataTemplate>
                </asp:GridView>
            </div>
      <asp:Button ID="Button1" runat="server" Text="Cancel" PostBackUrl="~/ITAdmin/ManageUsers.aspx" />

 
1
lax4u
5/4/2009 10:31:19 PM
asp.net.presentation-controls 72751 articles. 3 followers. Follow

3 Replies
3958 Views

Similar Articles

[PageSpeed] 30

Do you need to specify the height? How does this do?

    <div style="overflow: auto">       
            <asp:GridView ID="GridView1" runat="server"
            </asp:GridView>       
    </div>

If you do need to specify the height, then one way is to add 'runat=server' to the div. Then check if the GridView has rows. If it doesn't, access the div in code behind and set the height to 0.


ASP.NET Grid With Excel Capabilities | 27 GridView Tips & Tricks | Hosting your site? | SQL Server Tips
-1
Suprotim
5/5/2009 12:58:21 AM

In Design specify like this

<div id =scrdiv runat=server>
                <asp:GridView ID="gvNotes" runat="server" AutoGenerateColumns="false" OnRowCreated="gvNotes_RowCreated">
                    <Columns>
                        <asp:BoundField DataField="Note" HeaderText="Comments" />
                        <asp:BoundField DataField="CreateDate" HeaderText="Create Date" />
                        <asp:BoundField DataField="CreateUser" HeaderText="User" />
                    </Columns>
                    <EmptyDataTemplate>
                        <asp:Label ID="Label18" runat="server" Text="No comment has been added yet."></asp:Label>                    </EmptyDataTemplate>
                </asp:GridView>
            </div>
      <asp:Button ID="Button1" runat="server" Text="Cancel" PostBackUrl="~/ITAdmin/ManageUsers.aspx" />

 

In code file  

if (gvNotes.Rows.Count > 5)
     {
                        scrdiv.Style.Add("overflow-y", "scroll");
                        scrdiv.Style.Add("height", "385px");
      }

else

{

                        scrdiv.Style.Add("overflow-y", "");
                        scrdiv.Style.Add("height", "");

 

Defaultly overflow gives vertical and horizontal scrolls. If we specify overflow-y then it gives vertical scroll only. 


Thanks,
R.charan kumar

Please mark the most helpful reply/replies as "Answer".
0
charan2021
5/5/2009 3:42:00 AM

Suprotim Agarwal

you have to specify height  otherwise how would you get scrollbars? bcoz if you dont specify height the DIV will keep growing along with gridview.

0
lax4u
5/5/2009 5:24:30 AM
Reply:

Similar Artilces:

Changing field names (display name) for a web interface and how to create a scroll bar for a datagrid or any control with a scroll bar to display data
Hello,  Can any1 please help me. i was wondering if any1 can tell  me how i can change  field names for a data grid only for the display on the web interface and also how can i put scroll bars on my data grid. Thank you.       Hi misbahmurtza, You can set field names in HeaderText attribute in any column or template. If you want to create a scroll bar, the easiest way is to set style for the <div> which contains your datagrid. Here is a sample: <div style="vertical-align: top; height:100px; width:100%; overflow:auto;"> Make sure ...

Is there a control which can display scroll bar when image dimension exceed the control
I put a image in the control, when the image dimension is less than the control dimension, it's normal, but when  the image dimension is larger than the control dimension, I hope the control can display a scroll bar , so I can view full dimension image by operate scroll bar.SuperCool Multiple ZIP - A utility to unzip multiple files and work with multiple zip filesSuperCool Random Number Generator Hi, You could simply place your image inside a HTML DIV element with a CSS class that keeps the dimensions, something like the following would work: .scrollableImage...

Menu control is displaying behind Gridview control
I have placed a menu control just above the gridview control but when i click the menu control it displaysome of the menu options and rest of the menu options display behind the gridview.Is there anyway any option which make the menu to display over gridview.Mark as answer if anybody's post has helped you Typically the ZIndex will control that: http://www.w3schools.com/Css/pr_pos_z-index.aspDavid Kiffhttp://DavidKiff.co.uk-- "Mark As Answer" If my reply helped you --...

gridview control in another gridview control
Hi ia have a questioni have a gridview control which contains button in one colum.now my question is i need another gridview to be placed in the  first gidviewso that when i click on the button the second gridview will populate the data.now my question is how to place second gridview in first gridview.or is there any approach like first grid itself acting as parent and child.please help me  Hi sirikalavalapalli:                I think nested gridview will help you. Check this link and it will show you how...

How to maintain the scroll bar position of the treeview control in a webpart control?
I have a tree view control in a webpart control.  Between postbacks, the scroll is reset to the top of the panel control that contains the tree view control.  Basically I like to achieve the same functionality of TreeNode's EnsureVisible in the Win Form, but in the Web Form. I tried the following client-side script that I read at other posts var name = tvNavigation_Data.selectedNodeID.value;var selectedNode =Document.all?Document.all[name]ocument.getElementById(name);if(selectedNode){ selectedNode.scrollIntoView(true); } where tvNavigation_Data is the name of the tree view c...

Help Req: !!! :- On Disabling Controls Present inside a Gridview control
Hi All, We have A requirement Where we have disable controls inside a grid.These controls can be textbox, DropDownlist (in TemplateField), ComandField present inside the grid.We have to call a generic method for doing the same .(since it can be done for multiple grid.) PFB the code snippet we use. Which disables all the controls inside the page.The bolded part of the code is used to loop inside a grid view.(Not Working.)Is this ideal way to deal with the requirement.Or can someone suggest be a better way.        public void DisableMe(Page p1, st...

-- Need to Display data in two GridView controls, but second one could not be displayed?
Dear all, I wrote a code segment to display data in two GridView controls one by one as below. The first one is displayed ok. But, the second one is not displayed. Did I miss anything?         ads.DataFile = "~/App_Data/color_match_live.mdb"                ads.SelectCommand = "SELECT COUNT(*) FROM [tech_mstr] WHERE [month] = ?"        ads.SelectParameters.Add("month", sel_month)        Di...

how to control scrolling on a gridview
I want to programatically control the number of rows that are displayed in my gridview.  There will be times when my gridview will have a lot of rows and I want to make sure that the user can see all the data without having to scroll down the page... Yes, I know that there is a page property, etc.  But my user does not like the page function... On top of that, he does not want the headers to scroll off when he is "paging" through the gridview with the vertical scroll bar. So, does anyone have any idea how I can mimic the pager functionality so I can keep the gridview on the web ...

Gridview control embedded in another gridview control
I am writing an ambulance crew scheduling application on the web and I need some help completing the last part.  I have an access database that has three tables: user table, shift table (describing the shifts available), and a schedule table (that stores shift by shift_id and user by user_id).  I have a gridview control that will display the available shifts but I cannot get the embedded gridview control that will display the user that is signed up for each shift to display because I cannot figure out how to use the OnRowDataBound method.  I need a simple VB example of how to...

Gridview scroll bar
Is there a way to replace a gridview pager with a scroll bar?   dwfreeman:Is there a way to replace a gridview pager with a scroll bar? What you can do is first disable paging on your gridview.Now create a div with a fixed height, and set it to overflow on the y axis so that it will create a vertical scroll bar if the content it not entirely visible. add your grid view inside on this div.  jimmy q: dwfreeman:Is there a way to replace a gridview pager with a scroll bar?  What you can do is first disable paging on your gridview. Now create a div with a fixe...

Scroll Bars In GridView
Hi Friends, I am using Visual Studio 2005 Asp.net 2.0.I am Using grid view toshow  Excel sheet data with auto generated columns.I have so many Columns.I would like to have Scroll Bars(Both..vertical and H).in grid . I am not able to figure out this property .I tried from Style use Scroll Bars all the time still its not working.Could you please help me out Thanks in Advance. Steev     One of the easiest to implement, will be to use a containing div setting its overflow using css and gridview paging.  Example: HTML <%@ Page Language="C#" AutoEventWireup="tru...

scroll bar in gridview
hi, i have a gridview in a masterpage inside a panel.can any body tell me how to put scroll bar property to panel or to gridview. i am writing gridview in side a div like this <div style="width: 100%; top:150px; height: 250px; overflow: scroll"> gridview </div> it is showing the scrolls but not going focus on this take the properties of the panel, look for scroll bars, select both / vertical or horizontal .. as u like....     <td style="width: 293px"> <asp:Panel ID="Panel1" runat="server" Height="207px&q...

Gridview Scroll bars
Hi experts, I am new to ASP.Net. Having one gridview its having nearly 20 feilds .....but i need to pu scrollbars to gridview (header and itemfields also). by Using CSS sheet , i can scroll only item fields...it not for header ..   Can anyone help me.. Thanks in Advance.. Laxmi.M. Please refer to: http://forums.asp.net/t/1388576.aspxHope this helps...Don't forget to mark as answer, if it helps laxmi.m: Hi experts, I am new to ASP.Net. Having one gridview its having nearly 20 feilds .....but i need to pu scrollbars to gridview (header and itemfields also). by Using...

scroll bars for gridviews
Hi, Is there anybody who can help me with the following please?  I have a gridview inside of a master page. The gridview connects to a database and displays the rows and columns as usual, but some times the information is too big and the gridview expands horizontally way too far! I would ideally want the gridview to have scroll bars. I've tried using div tags around the gridview along with specifying the flow of the scroll bars as suggested, but for some unknown reason it doesn't do anything! Why? I got idea from another forum:I removed document type from aspx  page it starte...

Web resources about - Displaying Scroll Bar for a GridView - asp.net.presentation-controls

List of mammals displaying homosexual behavior - Wikipedia, the free encyclopedia
For these mammals, there is documented evidence of homosexual behavior of one or more of the following kinds: sexual behavior , courtship , affection ...

Facebook Displaying Page Insights On Page Admins’ Personal Pages?
Some Facebook page administrators are seeing modules on their personal pages displaying page insights ad, campaign , and like totals for pages ...

Facebook Displaying Unread Messages from Pages in a New Updates Module
Facebook is displaying a new “Updates” sidebar module which shows some users unread messages sent to them by Pages. Users will see the Updates ...

Don Lemon Holds Up Sign Displaying the N-Word, Uncensored, on Air CNN Live - YouTube
Don Lemon Holds Up Sign Displaying the N-Word, Uncensored, on Air Lemon held up a Confederate flag first before holding up the sign. He asked, ...

Hazelwood coal mine fire: Morwell residents displaying symptoms similar to cigarette smokers, expert ...
An expert says some locals near Victoria's Hazelwood mine fire have symptoms similar to cigarette smokers.

Police accused of displaying fake G20 weapons
Toronto's top police officer misled the public by displaying fake weapons used in a medieval-themed role-playing game to help justify their actions ...

No charges for U.S. host for displaying high-capacity magazine on TV
NBC television journalist David Gregory won't face charges for displaying a high-capacity ammunition magazine on his "Meet the Press" news program ...

Jays' Escobar suspended three games for displaying slur
Toronto Blue Jays shortstop Yunel Escobar has been suspended three games for displaying a homophobic slur on his eye-black during a game on Saturday. ...

Google Play Store now displaying age-based ratings
We reported back in May that Google was adding age-based ratings to all apps in the Play Store as determined by the International Age Rating ...

Apple displaying Ferraris & other cars at WWDC hinting at CarPlay announcements
... 2014 Filed under: AAPL Company , iOS Continue reading more about AAPL Company and iOS at 9to5Mac . What do you think? Discuss "Apple displaying ...

Resources last updated: 1/23/2016 9:32:56 PM