Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

How to add a horizontal scrollbar to a select list?

Posted on 2004-04-19
7
Medium Priority
?
9,904 Views
Last Modified: 2012-06-21
I dynamaically generate a dropdown list with fixed width, some records are long, I need a horizontal scrollbar to to view whole records. I use IE. How can I do this?
Please help.
0
Comment
Question by:siyu
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
  • 2
  • +1
7 Comments
 
LVL 12

Expert Comment

by:venkateshwarr
ID: 10862449
No you canno do that.
0
 
LVL 12

Expert Comment

by:venkateshwarr
ID: 10862455
If you want to do something like that... you have to use DHTML and create a user defined menu like structure..
0
 
LVL 1

Author Comment

by:siyu
ID: 10862519
Hi Venkateshwarr,
Can you give me an example or some online links about how to do it by using DHTML?
Thanks!
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 31

Expert Comment

by:seanpowell
ID: 10862810
No points for me, as I haven't had a chance to see how cusomtizable this guy's code is...

This is one example of a dhtml select box:
http://webfx.eae.net/dhtml/select/jsGenerated.html
0
 
LVL 10

Expert Comment

by:rockmansattic
ID: 10862989
Dont think putting a scroll bar on a dropdown is possible.  

Better to design without fixed width, allow for longer entries, and validate new records to allow a maximum number of chars.

OR

Dive deep into new territory, your new code may help future coders.

0
 
LVL 31

Accepted Solution

by:
seanpowell earned 400 total points
ID: 10868427
Just a follow up here. I downloaded the custom dhtml box linked above. You can generate a horizontal scrollbar by changing the following:

In classic.css:

.dropDown
      {
      position: absolute;
      visibility: hidden;
      width: 100%;
      border: 1 solid windowtext;
      padding: 0;
      background: window;
      color: windowtext;
      }

becomes:

.dropDown
      {
      position: absolute;
      visibility: hidden;
      width: 100%;
      /* creates the scrollbar */
      overflow:auto;
      /* prevents the line from wrapping*/
      white-space:nowrap;
      border: 1 solid windowtext;
      padding: 0;
      background: window;
      color: windowtext;
      }

An example of the html would be:

<script type="text/javascript">
<!--

var optionArray = new Array();
optionArray[0] = new Option("Item 1", "value 1");
optionArray[1] = new Option("This is a long item and will generate a scrollbar", "value 2");
optionArray[2] = new Option("Item 3", "value 3");
optionArray[3] = new Option("Item 4", "value 4");
optionArray[4] = new Option("Item 5", "value 5");

writeSelectBox(optionArray, "select1", 1, "alert(this.options[this.selectedIndex].value)", "margin-left: 10;");

//-->
</script>
0
 
LVL 1

Author Comment

by:siyu
ID: 10888798
Thank you, it works.
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

670 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question