September 21, 2014
Hot Topics:
RSS RSS feed Download our iPhone app

ASP.NET Tip: Creating Scrollable Micro Windows

  • October 22, 2003
  • By Karl Moore
  • Send Email »
  • More Articles »

Imagine that you're displaying a large table of results on your page. Wouldn't it be nice to show the table inside a neat scrollable micro window, rather than serving up one big messy page?

It's completely possible, and it requires only the smallest of changes.

Here's a quick sample that demonstrates the technique. It uses a div tag and relevant sizing and overflow attributes to define the micro window. Nested between the opening and closing <div> tags is the content we want to encapsulate (in this case, the HTML from our data grid).

<div style="width:100%; height:200; overflow:auto;">
  <asp:datagrid id=MyDataGrid runat=server />
</div>

To add this effect, open your project in Visual Studio .NET and enter HTML view in the ASPX page that you want to change. Make your alterations, using this sample as a template, and then switch back to Design view. You'll notice the designer automatically recognizes the tags and displays your DataGrid (or other controls) inside a micro window of the size you specified. It's perfect!

Figure: An example of the easy "micro window" in play

About the Author

Karl Moore (MCSD, MVP) is an experience author living in Yorkshire, England. He is author of numerous technology books, including the new Ultimate VB .NET and ASP.NET Code Book (ISBN 1-59059-106-2, $49.99), plus regularly features at industry conferences and on BBC radio. Moore also runs his own creative consultancy, White Cliff Computing Ltd. Visit his official Web site at www.karlmoore.com.

# # #






Comment and Contribute

 


(Maximum characters: 1200). You have characters left.

 

 


Sitemap | Contact Us

Rocket Fuel