How do I programmatically set the value of a select box element using JavaScript?

Question

I have the following HTML element:

Annual Leave&l

Answer 1

I tried the above JavaScript/jQuery-based solutions, such as:

$("#leaveCode").val("14");

and

var leaveCode = document.querySelector('#leaveCode');
leaveCode[i].selected = true;

in an AngularJS app, where there was a required element.

None of them works, because the AngularJS form validation is not fired. Although the right option was selected (and is displayed in the form), the input remained invalid (ng-pristine and ng-invalid classes still present).

To force the AngularJS validation, call jQuery change() after selecting an option:

$("#leaveCode").val("14").change();

and

var leaveCode = document.querySelector('#leaveCode');
leaveCode[i].selected = true;
$(leaveCode).change();

0 讨论(0)

查看其它17个回答

发布评论: