как сделать выбор городов c выпадающим списком пренадлежащие к определенной области из json файла?
есть файл json https://api.hh.ru/areas/5
нужно чтобы на странице выпадающший список в котором все эти области клацаешь на область открывается список городов и уже выбираешь город
<select name="city" id="billing_city" class="country_to_state city_select " autocomplete="city" required>
<option value="">Выбрать город</option>
</select>
спасибо
Ответы (1 шт):
Автор решения: Aziz Umarov
→ Ссылка
Если на скорую руку то можно так
let dataList = {};
fetch('https://api.hh.ru/areas/5').then( response=> {
return response.json()
}).then(
json=> {
dataList = json;
json.areas.forEach( area =>{
var opt = document.createElement('option');
opt.value = area.id;
opt.innerHTML = area.name;
billing_area.appendChild(opt);
}
);
}
);
billing_area.addEventListener('change', () => {
billing_city.innerHTML = '';
dataList.areas.filter(item => item.id == billing_area.options[billing_area.selectedIndex].value)[0].areas.forEach(
area=>{
var opt = document.createElement('option');
opt.value = area.id;
opt.innerHTML = area.name;
billing_city.appendChild(opt);
}
)
});
<select name="city" id="billing_area" class="country_to_state city_select " autocomplete="city" required>
<option value="">Выбрать область</option>
</select>
<select name="city" id="billing_city" class="country_to_state city_select " autocomplete="city" required>
<option value="">Выбрать город</option>
</select>