Столкнулся с такой проблемой. Есть список input type="radio", и на деле он очень большой, так что возникла необходимость вывести это все дело через select, таким образом, чтобы при выборе option этого select, нужный radio становился активным. сами input radio я потом хотел просто скрыть. я сделал вот такой код, он работает, но почему то только несколько раз, а потом перестает, хоть убей не пойму почему
document.addEventListener('DOMContentLoaded', function(){
let select = document.querySelector('#select-delivery'),
radioItem = document.querySelectorAll('.delivery__item');
select.addEventListener('change', function(){
let thisValue = this.value;
radioItem.forEach( item => {
if( item.value == thisValue ){
item.setAttribute('checked', 'checked');
} else{
item.removeAttribute('checked');
}
});
});
});
<div class="col-12 col-md-6" id="deliveries">
<h4>Варианты доставки:</h4>
<div class="form-group row">
<div class="col-12">
<div class="checkbox">
<label class="col-form-label delivery input-parent">
<input class="delivery__item" type="radio" name="delivery" value="1" id="delivery_1" data-payments="[1]">
Самовывоз
</label>
</div>
<div class="checkbox">
<label class="col-form-label delivery input-parent">
<input class="delivery__item" type="radio" name="delivery" value="2" id="delivery_2" data-payments="[1]" >
По региону
</label>
</div>
<div class="checkbox">
<label class="col-form-label delivery input-parent">
<input class="delivery__item" type="radio" name="delivery" value="3" id="delivery_3" data-payments="[1]">
По городу
</label>
</div>
<div class="checkbox">
<label class="col-form-label delivery input-parent">
<input class="delivery__item" type="radio" name="delivery" value="4" id="delivery_4" data-payments="[1]">
По стране
</label>
</div>
<select name="" id="select-delivery">
<option value="0">Не выбрано</option>
<option value="1">Самовывоз</option>
<option value="2">По региону</option>
<option value="3">По городу</option>
<option value="4">По стране</option>
</select>
</div>
</div>
</div>
https://codepen.io/sergo/pen/rNLOKLG?editors=0011
Был бы очень признателен за подсказку, только, если можно, на чистом js