Add Scrollbars to Your DataGrids

UI Tip

LANGUAGE: HTML | All.NET Languages

ASP.NET VERSIONS: 1.0 | 1.1

Add Scrollbars to Your DataGrids

How do you give an ASP.NET control scrollbars when ithas no scroll-related properties? Here's how.

By Brad McCabe

One of the most common questions I get is, "How can youmake an ASP.NET control have scrollbars when there are no scroll-relatedproperties on the control?" This is usually requested in a scenario where youhave a large amount of data on a DataGrid and you don't want to use pagination.

The answer to this question is to put two lines of HTMLaround the ASP.NET control. If you wrap your control in a DIV tag you can usethe overflow style attribute to have the browser render scroll bars when theHTML inside of the DIV tag exceeds the specified size, as shown in Figure 1.

Figure 1. The way to put scrollbarson a DataGrid control isn't to use ASP.NET at all. Instead, put a goodold-fashioned DIV tag around the control.

The following code will render the DataGrid inside of anarea that is 400 pixels wide and 500 pixels high:

Once the resulting HTML from the DataGrid control exceedsthis space, the browser will render either horizontal or vertical scrollbars asneeded as show in the figure.

Sometimes the simplest answer to a complex ASP.NET problemlies in the simple behaviors of an HTML element. ASP.NET does not allow you tosimply throw out your JavaScript knowledge and understanding, nor does ASP.NETallow to you forget - or never learn - HTML. In fact, knowledge of basic HTMLand JavaScript is often the difference between an average ASP.NET developer andan expert.

The sample code in thisarticle is available for download.

Got a UI question, tip, or idea for a topic you'd like meto cover? I'd love to hear it. E-mail me at [email protected].

Brad McCabe is thetechnical evangelist for Infragistics. Brad also has been a systems architectand consultant for Verizon Communications and many other clients, and he was aleading .NET evangelist within Ajilon Consulting. His primary interests includeASP.NET, Windows CE .NET, .NET Compact Framework, and Microsoft's networkingtechnologies. E-mail him at [email protected].