Я использую angular js и HTML для создания базового веб-сайта, и у меня есть раскрывающееся меню с 3 параметрами, по какой-то причине первое значение в поле параметра не выбрано по умолчанию. HTML-страница в браузере показывает пустую опцию (хотя у меня нет пустой опции в моем списке выбора);
HTML в браузере:
HTML-код:
<div class="col-md-4">
<select id="eventtype2" ng-model="formAdata.eventtype2" class="form-control">
<option class="dropdown-item" value="ordinaryevent">Ordinary Event</option>
<option class="dropdown-item" value="errordeclaration"> Error Declaration </option>
</select>
</div>
Мое требование состоит в том, что первый вариант Ordinary Event
должен быть выбран в поле при загрузке страницы. Я попробовал вариант selected
, но все равно не повезло. При загрузке страницы на долю секунды поле показывает значение Ordinary Event
но потом пропадает. Я не пытаюсь скрыть это в угловатых или что-то еще, не знаю почему.
Я также пробовал следующее, но не повезло:
<div class="col-md-4">
<select id="eventtype2" ng-model="formAdata.eventtype2" class="form-control">
<option class="dropdown-item" value="ordinaryevent" selected>Ordinary Event</option>
<option class="dropdown-item" value="errordeclaration"> Error Declaration </option>
</select>
I tried adding the following command to my angular:
$scope.formAdata.eventtype2 = 'ordinaryevent';
Но после добавления этой команды по какой-то причине мои другие выпадающие списки, которые заполняются из node.js, перепутались:
<div class="row">
<div class="col-md-12 form-group">
<label for="eventtype1" class="col-md-3 control-label">Event Type</label>
<div class="col-md-4">
<select id="eventtype1" ng-model="formAdata.eventtype1" class="form-control" ng-options='eventtype1 for eventtype1 in eventType'>
<option class="dropdown-item" value="" disabled selected>Select Event Type</option>
<option class="dropdown-item" value="{{eventtype1}}"> {{ eventtype1 }} </option>
</select>
</div>
<div class="col-md-4">
<select id="eventtype2" ng-model="formAdata.eventtype2" class="form-control">
<option class="dropdown-item" value="ordinaryevent" selected>Ordinary Event</option>
<option class="dropdown-item" value="errordeclaration"> Error Declaration </option>
</select>
</div>
</div>
app.controller('AppController', function($scope, $http) {
$scope.formAdata.eventtype2 = 'ordinaryevent';
$scope.createEvents = function(){
$http({
url: "/createEvents",
method: "POST",
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
data: $.param($scope.formAdata)
}).success(function(response) {
$scope.xmldata = response[0].XML;
$scope.jsondata = JSON.stringify(JSON.parse(response[1].JSON), undefined, 4);
}).error(function(error) {
console.log(error)
});
}
$scope.init = function () {
$http({
url: "/populateFields",
method: "GET"
}).success(function(response) {
$scope.businessSteps = response.businessStep;
$scope.eventType = response.eventType;
}).error(function(error) {
console.log(error);
});
};
});