expand a drop downlist when click on the more option

Question

I have a dropdownlist and it contains a list of names and a 'more' option.When the user click on the more option,it will load more names from database and display those names in the dropdownlist.But what I want is, when the user click on the more option ,dropdownlist will expand with the data from database without closing the dropdownlist.I have used ajax call to populate the dropdownlist from database.Currently when the user click on the more option ,the dropdownlist will close and again user want to click on the dropdownlist to see more options.Thanks in advance for the answers.

Possible duplicate of [Can I open a dropdownlist using jQuery](http://stackoverflow.com/questions/360431/can-i-open-a-dropdownlist-using-jquery) — Muhammed Shevil KP, Dec 26 '16 at 09:19
Post Your code and effort..and you can reopen the dropedown when you ajax call response come then using jquery or javascript open the dropdown it will be as it is — black_pottery_beauty, Dec 26 '16 at 09:20
Default browser dropdown do not support this. Try to use jQuery plugins to achieve this or similar behaviors https://www.sitepoint.com/13-jquery-selectboxdrop-down-plugins/ — VadimB, Dec 26 '16 at 09:23

score 0 · Answer 1 · answered Dec 26 '16 at 09:29

<!DOCTYPE html>
<html>
<body>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
function showHideOther(){
    if (document.getElementById('drop_down').value == 'other') {

        $.get("xyz.php", function(data, status){
        $('#drop_down').attr('size',4+data.length);
        });


    }
}
</script>
<select name="" id="drop_down" onchange="showHideOther();">
        <option value="choose">Please choose</option>
        <option value="Allure">a</option>
        <option value="Elle">b</option>
        <option value="In-Style">c</option>
        <option value="other">More</option>
</select>
</body>
</html>

Thank you for the answer.Its a good one.I have tried this solution.But the problem is the focus goes to the first option of drop down list.That is not I wanted.I want to focus on the first option after 'more' option. — Kesiya Abraham, Dec 26 '16 at 09:49

expand a drop downlist when click on the more option

1 Answers1