Introduction
Have you ever imagined putting a horizontal scroll bar in a list box? As we are living in a high speed internet world, everybody wants their web application to look exactly similar to Windows applications and this article will explain how easily we can create a horizontal scroll bar using ASP.NET.
Problem
See the image given below. You have a list box which is supposed to hold a long text and the width won't fit into the listbox's width.
Have you ever thought about changing a small property to change the style to show a horizontal scroll bar?
There is nothing like that available in ASP.NET.
Easy Way
We can put this list box inside a DIV
and set the style for DIV
to overflow which will automatically show the scroll bar whenever necessary.
Your aspx page has the following DIV
:
<div id='hello' style="Z-INDEX: 102; LEFT: 13px; OVERFLOW:
auto; WIDTH: 247px; POSITION: absolute; TOP: 62px; HEIGHT: 134px" >
Important style you need to note is:
OVERFLOW: auto
inside the style
element.
Now you can put your asp:listbox
inside the DIV
definition. Inside your code behind class' page_load
function, you need to define the width and height of the list box properly, so that it won't overflow with the DIV
.
Server side code looks as given below:
private void Page_Load(object sender, System.EventArgs e)
{
if (!IsPostBack)
{
int nItem = Convert.ToInt32(ListBox1.Items.Count * 17);
ListBox1.Height = nItem;
ListBox1.Width = 800;
}
}
Points of Interest
Nobody likes this way of implementing this. But as long as this meets the business requirements, everybody will be happy.
History
- August.22.2005 - version 1.0.