#javascript #angularjs #dom
#javascript #angularjs #dom
Вопрос:
Я пытаюсь поместить текст в класс select.
Вот следующий код;
<div class="col-xs-12 col-sm-9">
<select class="form-control col-l10 col-m7 col-s7 esw-select ng-pristine ng-invalid ng-invalid-required ng-touched" ng-class="{'is-invalid': shipping_subform.$submitted amp;amp;amp;amp; shipping_subform.shippingRegion.$invalid}" id="Shipping_Territory" required="" ng-options="region.code as region.name for region in regions" ng-model="userOrder.Shipping.Address.Region" name="shippingRegion" tooltip="Please select a province" tooltip-toggle=" shipping_subform.$submitted===true amp;amp;amp;amp; shipping_subform.shippingRegion.$invalid===true" esw-google-analytics-blur="">
<option value="" class="ng-binding">Select a province</option>
<option value="0" label="Ontario">Ontario</option>
<option value="1" label="British Columbia">British Columbia</option><option value="2" label="Manitoba">Manitoba</option>
<option value="3" label="Alberta">Alberta</option>
<option value="4" label="New Brunswick">New Brunswick</option>
<option value="5" label="Newfoundland and Labrador">Newfoundland and Labrador</option>
<option value="6" label="Northwest Territories">Northwest Territories</option>
<option value="7" label="Nova Scotia">Nova Scotia</option><option value="8" label="Nunavut">Nunavut</option>
<option value="9" label="Prince Edward Island">Prince Edward Island</option>
<option value="10" label="Quebec">Quebec</option>
<option value="11" label="Saskatchewan">Saskatchewan</option>
<option value="12" label="Yukon">Yukon</option>
</select> <!-- ngIf: shipping_subform.$submitted amp;amp; shipping_subform.shippingRegion.$invalid -->
</div>
Я попробовал следующее, которое работает; однако, когда я нажимаю кнопку отправки, он говорит, пожалуйста, выберите провинцию.
Это работает, но на самом деле это не работает при нажатии кнопки отправки;
document.querySelector('#Shipping_Territory [label= Ontario]').selected = true;
Предположительно, я должен использовать angular, но я не знаю, что поместить в triggerHandler.
var e = document.getElementById("Shipping_Territory");
e.value = "Ontario";
var $e = angular.element(e);
$e.triggerHandler('??');
Я пробовал в triggerHandler, изменить, changed, выбрать, selected, но это просто превращает выпадающий список select в пустой.
Любая помощь приветствуется, спасибо.
Ответ №1:
Добавьте идентификатор в тег
<select id="selectedOption" class="form-control col-l10 col-m7 col-s7 esw-select ng-pristine ng-invalid ng-invalid-required ng-touched" ng-class="{'is-invalid': shipping_subform.$submitted amp;amp;amp;amp; shipping_subform.shippingRegion.$invalid}" id="Shipping_Territory" required="" ng-options="region.code as region.name for region in regions" ng-model="userOrder.Shipping.Address.Region" name="shippingRegion" tooltip="Please select a province" tooltip-toggle=" shipping_subform.$submitted===true amp;amp;amp;amp; shipping_subform.shippingRegion.$invalid===true" esw-google-analytics-blur="">
И получить индекс selectedOption с помощью:-
document.getElementById("selectedOption").options.selectedIndex
я надеюсь, это поможет!
Комментарии:
1. Это не помогает, я думаю, что я должен сделать это угловым способом. Кроме того, как бы я ввел текст, все, что делает ваш, это получает индекс.
Ответ №2:
Я успешно использовал следующее;
var e = document.getElementById("Shipping_Territory");
e.value = 2;
var $e = angular.element(e);
$e.triggerHandler('change');