如何基于保存的选择框值更改选择框值

Question

if (itemPrice != null) {
        var option = null;
        for (var i = 0; i < itemPrice.d.length; i++) {
            option += '<option value=' + itemPrice.d[i].ListNum + '>' + itemPrice.d[i].ListName + '</option>';
        }

    } else {
        SessioExp(response.statusText);
    }

    tblRow += '<td style="width:20%"><div id="' + d.ItemCode + '"><select class="customSelect" name="dropdown" >' + option + '</select></div></td>';
    $.each(itemLinked, function (k, v) {
        if (d.ItemCode == v.ITEMCODE) {
           //Here set v.PRICELIST TO OPTION VALUE
            if (v.ISLINKED) {
                tblRow += '<td style="width:10%" align="center"><a href="#"><span id="existingData" class="fa fa-times" aria-hidden="false" style="display: none;"></span></a></td>';
                tblRow += '<td style="width:10%" align="center"><input type="checkbox" class="chkLinked" checked /></td>';
                flage = false;
            }
        }
    });

I want set select box value when condition true if (d.ItemCode == v.ITEMCODE)

tblRow += '<td style="width:20%"><div id="' + d.ItemCode + '"><select class="customSelect" name="dropdown" >' + option + '</select></div></td>';

Here we want to show first saved value.

Answer 1

Assuming that your generated options have been appended to the html, you can simply call the JS function optionID.selected = true

So for that you will need to define ids to all your options

// assuming that all your values are unique
for (var i = 0; i < itemPrice.d.length; i++) {
   option += '<option id=' + itemPrice.d[i].ListNum + ' value=' + itemPrice.d[i].ListNum + '>' + itemPrice.d[i].ListName + '</option>';
}
//pass the option id here
//P.S you can only call this funtion only if the options have been appended to the html
function defineOption(optionID) {
     document.getElementById(optionID).selected = true;
}