Set value of Select option in Javascript

Question

Is there any function to set value of a <select> tag option? I have an ajax response array and I want to put this array in a <select> tag.

This is my code :

$.ajax({
    type: "GET",
    url: "http://.......api/1/AbsenceType",
    dataType: "json", 
    success: function (data) {
        // It doesn't work
        var ind = document.getElementById('mySelect').selectedIndex;
        document.getElementById('mySelect').options.value="2";//
    }
})

And my select tag is :

<select id=mySelect name="mySelect" required="required" data-mini ="true" onchange="myFunction3();"/>
    <option id ="type" value=""></option>
</select>

Answer 1

I have an ajax response array and I want to put this array in a tag.

Why don't you just add the options from the array to the select, then set the selected value, like this :

Start with an empty select :

<select id="mySelect" name="mySelect">

</select>

Then use this function as a callback :

var callback = function (data) {

    // Get select
    var select = document.getElementById('mySelect');

    // Add options
    for (var i in data) {
        $(select).append('<option value=' + data[i] + '>' + data[i] + '</option>');
    }

    // Set selected value
    $(select).val(data[1]);
}

Demo :

http://jsfiddle.net/M52R9/

See :

• Adding options to a select using Jquery/javascript
• Set selected option of select box.