Multi Select in IE - item is selected, but not highlighted/registering with validation

Question

I am selecting an item in jQuery from my select like this:

$('#myDdl option[value="2"]').attr('selected', 'selected');

It then appears just fine if I inspect code (IE 10):

<select name="myDdl" id="myDdl" multiple="multiple" data-val="true" data-val-required="Required">
    <option value="1">bla2</option>
    <option value="2" selected="selected">bla2</option>
</select>

So it appears that it is working just fine. But if I look in the browser itself, it is not highlighted. Also, if I try to submit, I get the validation error that it is Required, hence not selected. If I bypass validation, the POST even shows empty as well for this element. This only happens in IE, any ideas?

Answer 1

You could try this:

HTML:

<form id="form">
    <select name="myDdl" id="myDdl" multiple="multiple" data-val="true" data-val-required="Required">
        <option value="1">bla1</option>
        <option value="2">bla2</option>
    </select>
    <input type="submit" id="btn" value="submit" />
    <form>

JAVASCRIPT:

$('#form').submit(function (event) {
    alert($('#myDdl').val());
    event.preventDefault();
});