473,320 Members | 2,145 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,320 software developers and data experts.

How to increase the number of items showin in a <select> dropdown box?

I have created a drop down box, which works fine, i want to increase the number of rows it shows without having to scroll, how do i do this though?


[PHP]
<td><select name="itjobtypeid" style="font: 10pt Tahoma" >
<option value=0 >Select IT Requests Type</option>
<?php
do {
?>
<option value="<?php echo $rowitjobtype['itjobtypeid']?>"><?php echo $rowitjobtype['jobtype']?></option>
<?php
} while ($rowitjobtype = mysql_fetch_assoc($resultitjobtype));
$totalRowsitjobtype = mysql_num_rows($resultitjobtype);
if($totalRowsitjobtype > 0) {
mysql_data_seek($resultitjobtype, 0);
$rowitjobtype = mysql_fetch_assoc($resultitjobtype);
}
?>
</select></td>
[/PHP]
Nov 7 '07 #1
8 3890
Atli
5,058 Expert 4TB
Hi Jason.

I've moved this question over to the HTML/CSS forums, where you are more likely to get an answer.

I've also changed the thread title to better describe it's contents.
Please try giving your threads descriptive titles. This helps the experts find threads they can help with and increases your chances of getting an answer.
Check out the Posting Guidelines for tips on how to create good thread titles.

Moderator
Nov 9 '07 #2
drhowarddrfine
7,435 Expert 4TB
This cannot be done.
Nov 9 '07 #3
Atli
5,058 Expert 4TB
This cannot be done.
This is what I suspected.

The only thing I know that comes close is the 'size' property of the <select> tag, which will change it into a list-box, rather than a drop-down box.
Nov 9 '07 #4
Perpet
3
@drhowarddrfine
Variations of these work for me depending on the specifics that you want:
onclick="size='45';" onmouseover="" onkeydown="size='60';" onfocus="" onmousedown="size='26';" onmouseout="size='1';" onmouseup="size='1';" onkeyup="size='1';" onchange="size='1';" onblur="size='1';"

Let us know what you run with.
Nov 26 '11 #5
omerbutt
638 512MB
hi try this code ,
Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Untitled Document</title>
  6. <style type="text/css">
  7. .my.options{
  8.     overflow:auto;
  9.     height:auto;
  10.     background:#000;
  11. }
  12. </style>
  13. <script type="text/javascript">
  14.  function height($){
  15.         $.size=$.options.length;
  16.     }
  17.     function closed($){
  18.         $.size=1;
  19.     }
  20.     function switcher($){
  21.         if($.size>1){
  22.             $.size='0';
  23.             document.body.focus();
  24.         }else{
  25.             height($);
  26.         }
  27.     }
  28. </script>
  29. </head>
  30.  
  31. <body>
  32. <table>
  33. <tr>
  34.     <td>
  35. <select name="itjobtypeid" class="my" onfocus="height(this);" onchange="switcher(this);">
  36. <option value=0 >Select IT Requests Type</option>
  37. <option value="1">1</option>
  38. <option value="2">2</option>
  39. <option value="2">3</option>
  40. <option value="2">4</option>
  41. <option value="2">5</option>
  42. <option value="2">6</option>
  43. <option value="2">7</option>
  44. <option value="1">1</option>
  45. <option value="2">2</option>
  46. <option value="2">3</option>
  47. <option value="2">4</option>
  48. <option value="2">5</option>
  49. <option value="2">6</option>
  50. <option value="2">7</option>
  51. <option value="1">1</option>
  52. <option value="2">2</option>
  53. <option value="2">3</option>
  54. <option value="2">4</option>
  55. <option value="2">5</option>
  56. <option value="2">6</option>
  57. <option value="2">7</option>
  58. <option value="1">1</option>
  59. <option value="2">2</option>
  60. <option value="2">3</option>
  61. <option value="2">4</option>
  62. <option value="2">5</option>
  63. <option value="2">6</option>
  64. <option value="2">7</option>
  65. <option value="1">1</option>
  66. <option value="2">2</option>
  67. <option value="2">3</option>
  68. <option value="2">4</option>
  69. <option value="2">5</option>
  70. <option value="2">6</option>
  71. <option value="2">7</option>
  72. </select></td>
  73. </tr>
  74. </table>
  75. </body>
  76. </html>
  77.  
  78.  
  79.  
Dec 2 '11 #6
Perpet
3
That's really cool, however it only works once, then goes back to the default dropdown. Its not obvious to me what needs tickling up to make it get the proper height again.
Dec 2 '11 #7
omerbutt
638 512MB
no its because you are just watching it in a blank page without any other field in side the form and the if you notice that the function height() is called onfocus and the focus is not lost until you click any other element or anywher inside the page , if you do it will work back to back and when you are inside a form with multiple inputs it wont happen there , but anyhow we can still improve it
regards,
Omer Aslam
Dec 2 '11 #8
Perpet
3
I want to thank you for your effort here Omer, I think this is a key usability requirement that is seldom considered. In the moment that one is searching for something generally the only need at that time is to see the data prospects (an exception is where one needs to visually copy the text that cannot be readily clipboarded, e.g. from an image). The eye and brain scans what can be seen quicker than any scrolling can ever achieve. Typically there is circa one or two million pixels in front of the person at the moment of that search, yet designers everywhere unwittingly say I am going to torture you with a little glimpse of what I have here for you - and I am going to make you work your fingers to get what you want. This is probably more important for NLP types who are visually dominant. Any interface not implementing this principle is not optimally usable. One of my pet farthings worth. Thank you for your contribution here.

I'll do some more testing, an obvious test is what happens when the number of rows exceeds the control / screen height?
Dec 2 '11 #9

Sign in to post your reply or Sign up for a free account.

Similar topics

2
by: Mad Scientist Jr | last post by:
I'm trying to get javascipt select all items in a HTML form <SELECT> control and submit the form to an asp.net page. For some reason when the link is clicked, you can see the items all get...
3
by: Darren | last post by:
Please Help Me!! I've created a typical <form> and a <select> element. The options are created dynamically from my access database (using asp). There are about 70 options, and when you click...
2
by: Joachim Bauer | last post by:
I'm using the code below to display a menu that opens when the mouse goes over the main menu item (try it in your browser to understand the behaviour). It uses "position:absolute" and a switch...
0
by: rayone | last post by:
Hi folks. I need advice. 2 options, which do you think is the better option to display/retrieve/report on the data. Keep in mind reporting (Crystal), SQL Performance, VB Code, usability,...
6
by: joseph.lindley | last post by:
Forgive me for I am a bit of a web-dev novice - but I'm not doing too bad. I'm currently working with a bit of javascript to dynamically add <option>s into a select box. My code currently works...
1
by: frey | last post by:
i tried to create a dropdown menu and use the option as a control to change content inside another text area the code is like this: <select name="xxxx"><option onclick="changeunitprice(29.87)"...
3
by: i_dvlp | last post by:
I'm trying to replicate a fancy drop-down control (MS-egads!) with form <select><option> It doesn't look like you can specity width as an attribute or define width with CSS. It looks like my...
5
by: Isha | last post by:
Hi all, I wanted to change the background color for only the first option in a select box, but following changed the background color for the whole dropdown box. <select name="alltags"...
2
by: ismailc | last post by:
Good day, I know it is not possible to change the border of a dropdown (select tag) in IE7 browser. I managed to change the height by increasing the font of the dropdown. I don't realy...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
0
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.