jquery populate select list

Question

I have this in my htm file

    <select id="SelItem">

    </select>

Within my javascript file I have a section for jquery I have the following

     var itemval= '<option value="OT">OT</option>';

     $("#SelItem").html(itemval);

Wouldn't the following populate my drop down with OT? It does not populate anything in the drop down

Looks fine to me. Are you running the code on DOM ready?

Matt Ball
– Matt Ball

2012-04-03 17:54:16 +00:00
Commented Apr 3, 2012 at 17:54 — Matt Ball
– Matt Ball, Commented Apr 3, 2012 at 17:54
Did you include jQuery on your page?

ShankarSangoli
– ShankarSangoli

2012-04-03 17:56:49 +00:00
Commented Apr 3, 2012 at 17:56 — ShankarSangoli
– ShankarSangoli, Commented Apr 3, 2012 at 17:56

Rion Williams · Accepted Answer · 2012-04-03 17:59:24Z

14

You might want to consider using append:

//Creates the item
var itemval= '<option value="OT">OT</option>';

//Appends it within your select element
$("#SelItem").append(itemval);

Example

Update

As js1568 pointed out - the problem is most likely stemming from the page not being loaded when the JS / jQuery code is being executed. You should be able to fix this with the following:

$(document).ready(function()
{
    //Creates the item
    var itemval= '<option value="OT">OT</option>';

    //Appends it within your select element
    $("#SelItem").append(itemval);
});

edited Apr 3, 2012 at 17:59

answered Apr 3, 2012 at 17:53

Rion Williams

76.9k38 gold badges206 silver badges335 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Matt Ball Over a year ago

If the code in the OP is not working, what makes you think this code would?

Rion Williams Over a year ago

@MДΓΓ - I was providing an alternative option and a working example of it. It appears the issue is most likely directly related to when the JS is being called however, much like js1568 pointed out.

js1568 · Accepted Answer · 2012-04-03 17:55:11Z

1

You need to wait until the page has loaded before running this code. Try wrapping your code inside $(document).ready() function.

Introducing $(document).ready()

answered Apr 3, 2012 at 17:55

js1568

7,0322 gold badges30 silver badges47 bronze badges

Comments

Kristian · Accepted Answer · 2012-04-03 17:57:48Z

0

The problem is when the jquery is called, not what its doing.

$(document).ready(function() {
     var itemval= '<option value="OT">OT</option>';
     $("#SelItem").html(itemval);
});

answered Apr 3, 2012 at 17:57

Kristian

22k19 gold badges108 silver badges184 bronze badges

Collectives™ on Stack Overflow

jquery populate select list

3 Answers 3

Update

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Update

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related