Как выбрать option в select по значению?

186

21 марта 2019, 22:10

Возможно ли указать значение option, которое будет выбираться по умолчанию при загрузке страницы? Пробовал через selected и selected="selected". Результат нулевой.

<select class="form-control" [(ngModel)]="typeSearch">
   <option [ngValue]="1" selected>Названию</option>
   <option [ngValue]="2">Автору</option>
   <option [ngValue]="3">Типу</option>
   <option [ngValue]="4">Расширению</option>
</select>

Answer 1

Судя по разметке - используется Angular.

При связывании через ngModel выбирается option чье значение совпадает со значением typeSearch.

Таким образом достаточно просто присвоить этой переменной или свойству нужное значение.

Answer 2

Можешь обойти циклом все значения select и применить порядковый номер соответствующего option (значение option совпадает с нужным значением) к select через selectedIndex.

Пример:

var defaultValue = "Расширению"; 
var yourSelect = document.querySelector('.form-control'); 
 
for (let i, j = 0; i = yourSelect.options[j]; j++) { 
  if (i.value == defaultValue) { 
    yourSelect.selectedIndex = j; 
    break; 
  } 
}

<select class="form-control" [(ngModel)]="typeSearch"> 
  <option [ngValue]="1">Названию</option> 
  <option [ngValue]="2">Автору</option> 
  <option [ngValue]="3" selected='selected'>Типу</option> 
  <option [ngValue]="4">Расширению</option> 
</select>

Если нужного значения в select нет, то будет выбрано значение selected или же самое первое (при отсутствии selected).