CODEWITHSUNDEEP
javascriptjquery
user2990084
user2990084

Reputation: 2840

Populate select dropdown

I want to populate a select dropdown when the user click in the select. I am trying this, but apparently the click handler is only activated when the user click in the options, but in my case i don't have options. Here is a demo

$('select').click(function () {
    var currentId = $(this).attr('id');
    alert(currentId);

    var total = $('.total').text();

    for (i = 0; i <= total; i++) {
        $('<option>').val(i).text(i).appendTo('#' + currentId);
    }
});

Upvotes: 0

Views: 80

Answers (2)

Sylordis
Sylordis

Reputation: 2559

You can try to populate the select on mouse over, it could save you some time and give you more accessibility. Sometimes adding options on click just prevents the select from opening when it's supposed to, which can lead to frustrating the user...

Upvotes: 0

Bhushan Kawadkar
Bhushan Kawadkar

Reputation: 28523

Try this :As you are appending options for every click and hence you are not able to see the options. You can use .one() to populate options only for the first click and for second time click it will show you the populated options. Also use this to append options instead of getting id of select box and use it.

$('select').one("click",function () {
    var total = parseInt($('.total').text());

    for (i = 0; i <= total; i++) {
        $('<option>').val(i).text(i).appendTo(this);//use this to append
    }
});

JSFiddle Demo

Upvotes: 3

Related Questions