В моем приложении AngularJS у меня есть модал Bootstrap 3 (UI Bootstrap), который содержит некоторые селекты и входные данные, генерируемые ng-повторениями. Всякий раз, когда значение изменяется в этих полях, я немедленно сохраняю данные через вызов API, а затем перезагружаю модель представления также через вызов API. Когда я впервые загружаю модал, я могу без проблем просматривать эти элементы. Однако, когда я использую клавиатуру для выбора / установки значения в любом из этих входов или выделений, фокус не остается на этом элементе после перезагрузки модели представления. По какой-то причине кажется, что фокус переходит к элементу тела.
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close" ng-click="ctrl.close()">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
...
<div class="col" ng-repeat="caseValue in attribute.caseValues track by $index">
<select ng-if="attribute.valueType === 'Options'" class="form-control" ng-disabled="caseValue.potentialValues.length === 0" ng-change="ctrl.saveValueToConfig(caseValue.selectedValue, attribute.valueType, ctrl.caseData.caseModels[$index].nodeId)" ng-model="caseValue.selectedValue" ng-options="value as value.name for value in caseValue.potentialValues"></select>
<input ng-if="attribute.valueType === 'QuoteIntake'" class="form-control" ng-disabled="caseValue.selectedValue === null" ng-change="ctrl.saveValueToConfig(caseValue.selectedValue, attribute.valueType, ctrl.caseData.caseModels[$index].nodeId)" ng-model="caseValue.selectedValue" ng-model-options="{updateOn: 'blur'}" ng-keyup="$event.keyCode == 13 && $event.target.blur()">
</div>
...
</div>
<div class="modal-footer">
<button type="button" class="btn" data-dismiss="modal" aria-label="Save" ng-click="ctrl.save()">Save</button>
</div>
Я бы ожидал после выбора / установки значения в элементах выбора и ввода, что фокус останется там. Кто-нибудь знает, почему фокус может прыгать на элемент тела?