I need to set the radio Button to the value I pass via url.
The code to create radio buttons is as follows:
function filterCategory(ads){
let categories = Array.from(new Set(ads.map(ann=>ann.category)));
let rowCategoryRadio = document.querySelector('#row-category-radio');
categories.forEach((cat,i) => {
let input = document.createElement('div');
input.classList.add('form-check');
input.innerHTML = `
<input class="form-check-input filter-category" type="radio" name="category-filter" id="flexRadioDefault${i}" data-filter="${cat}">
<label class="form-check-label" for="flexRadioDefault${i}">
${cat}
</label>
`
rowCategoryRadio.appendChild(input);
})
}<div class="row" id="row-category-radio">
<div class="form-check">
<input class="form-check-input filter-category" type="radio" name="category-filter"
id="flexRadioDefault1" data-filter="all" checked>
<label class="form-check-label" for="flexRadioDefault1">
All categories
</label>
</div>
</div>To set the radio button to the value I step I wrote the following code.
let url_string = window.location.href;
let url2 = new URL(url_string);
let name_url = url2.searchParams.get("name");
if(url_string.includes('?')){
let radios = document.querySelector('.filter-category');
let selected = radios.querySelector('data-filter');
selected = name_url;
selected.checked = true;
console.log(selected);The console.log gives me the correct value but is not checked in the radio button.
Can anyone kindly help me?