Asked  7 Months ago    Answers:  5   Viewed   48 times

Can someone confirm that its not possible to change the height of a dropdown that is shown when you click on a select box.

The size attribute of the select makes it look like a list, the height attribute in the CSS doesnt do much good either.




The part that drops down is set to either:

  1. The height needed to show all entries, or
  2. The height needed to show x entries (with scrollbars to see remaining), where x is
    • 20 in Firefox & Chrome
    • 30 in IE 6, 7, 8
    • 16 for Opera 10
    • 14 for Opera 11
    • 22 for Safari 4
    • 18 for Safari 5
    • 11 in IE 5.0, 5.5
  3. In IE/Edge, if there are no options, a stupidly high list of 11 blanks entries.

For (3) above you can see the results in this JSFiddle

Tuesday, June 1, 2021
answered 7 Months ago

simple ajax using jquery

index page

<!DOCTYPE html>
        <script src=""></script>
                //Selected value
                var inputValue = $(this).val();
                alert("value in js "+inputValue);

                //Ajax for calling php function
                $.post('submit.php', { dropdownValue: inputValue }, function(data){
                    alert('ajax completed. Response:  '+data);
                    //do after submission operation in DOM
    <select id="myDropDown">
        <option value='' disabled selected>Assign Driver</option>
        <option value='4353'>Steve Jobs</option>
        <option value='3333'>Ian Wright</option>
        <option value='66666'>Mark James</option>


in submit.php

function processDrpdown($selectedVal) {
    echo "Selected value in php ".$selectedVal;

if ($_POST['dropdownValue']){
    //call the function or execute the code

for simple js ajax use XMLHttpRequest

Saturday, May 29, 2021
answered 7 Months ago

You can save the Element.scrollTop and set it at the end.


    var select = this;
    var scroll = select .scrollTop; = !;

    setTimeout(function(){select.scrollTop = scroll;}, 0);

    $(select ).focus();

Thursday, June 3, 2021
answered 7 Months ago

That should do it:

<select >
    <option value="1" <?php echo ($Defaultselection == 1)?"selected":""; ?>>A</option>
    <option value="2" <?php echo ($Defaultselection == 2)?"selected":""; ?>>B</option>
    <option value="3" <?php echo ($Defaultselection == 3)?"selected":""; ?>>C</option>
    <option value="4" <?php echo ($Defaultselection == 4)?"selected":""; ?>>D</option>

or this other one:

<select >
    <option value="1" <?php if ($Defaultselection == 1) echo "selected"; ?>>A</option>
    <option value="2" <?php if ($Defaultselection == 2) echo "selected"; ?>>B</option>
    <option value="3" <?php if ($Defaultselection == 3) echo "selected"; ?>>C</option>
    <option value="4" <?php if ($Defaultselection == 4) echo "selected"; ?>>D</option>
Saturday, August 7, 2021
answered 4 Months ago

Just don't make it a select multiple, but set a size to it, such as:

  <select name="user" id="userID" size="3">

Working example:

Friday, September 3, 2021
answered 3 Months ago
Only authorized users can answer the question. Please sign in first, or register a free account.
Not the answer you're looking for? Browse other questions tagged :