473,573 Members | 2,839 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

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

15 New Member
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="itjobtype id" 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_ass oc($resultitjob type));
$totalRowsitjob type = mysql_num_rows( $resultitjobtyp e);
if($totalRowsit jobtype > 0) {
mysql_data_seek ($resultitjobty pe, 0);
$rowitjobtype = mysql_fetch_ass oc($resultitjob type);
}
?>
</select></td>
[/PHP]
Nov 7 '07 #1
8 3908
Atli
5,058 Recognized Expert Expert
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 Recognized Expert Expert
This cannot be done.
Nov 9 '07 #3
Atli
5,058 Recognized Expert Expert
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 New Member
@drhowarddrfine
Variations of these work for me depending on the specifics that you want:
onclick="size=' 45';" onmouseover="" onkeydown="size ='60';" onfocus="" onmousedown="si ze='26';" onmouseout="siz e='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 Contributor
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 New Member
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 Contributor
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 New Member
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
4547
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 selected, but then they are somehow unselected as the form posts. Any idea? My Html and ..net code follows: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0...
3
23297
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 the dropdown button, it shows about 25 (depending on screen resolution) and then the gives you a scroll bar to get to the rest. My question is,...
2
6427
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 between "display='none'" and "display=''". However the problem is that - in Internet Explorer 6 the dropdown (<select>...) always hides the menu
0
2210
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, architecture. Case 1: On a web page I would like to render a dropdown list
6
19591
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 fine in Internet Explorer, however in Firefox the dropdown only displays the first option in the list, and when clicked the other values aren't...
1
1844
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)" value="1744"/> the function changeunitprice() is called when an option is selected
3
14314
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 choices are to use smaller fonts or choose shorter option strings. inline: I want to put a small graphic immediately to the right of the select.
5
8726
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" class="select" style="background:yellow"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option>
2
5580
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 want to change the font, is there another way - i played around with line-heigth but also no luck. Please Assist!
0
7771
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main...
0
7686
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language...
0
8198
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that...
1
7771
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For...
0
8060
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the...
0
6406
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then...
1
5580
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes...
1
1296
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
0
1036
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating...

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.