Нужно без перезагрузки страницы передать значения чекбоксов в URL, чтобы потом можно было делиться этой ссылкой и нужные чекбоксы сразу же были выбраны.
На просторах нашёл код на jQuery, который работает, но не совсем корректно. Проблема в том, что если перейти на страницу и снять уже отмеченный чекбокс, то из ссылки он почему-то не убирается.
Может кто знает как доработать этот код, или поделитесь ссылкой на более элегантное решение?
Спасибо!
<form>
<ul>
<li><input type="checkbox" name='parameter-1[]' value="Value-A"/>Value A</li>
<li><input type="checkbox" name='parameter-2[]' value="Value-B"/>Value B</li>
</ul>
</form>
let objectWithCheckboxes={},
withParams=!!location.search,
siteHref=location.href
$('input').change(e=>{
let el=e.target,
jq=$(el)
if(jq.is(':checked')) objectWithCheckboxes[el.value]=el.name
else delete objectWithCheckboxes[el.value]
let res=[]
for(let k in objectWithCheckboxes) res.push(objectWithCheckboxes[k]+'='+k)
res=res.length?(withParams?'&':'?')+res.join('&'):''
window.history.replaceState('','',siteHref+res)
//^ эта строчка заменяет URL в браузере без перезагрузки страницы
console.log(siteHref+res)
//^ а это для теста
})
URL выглядит так: www.site.ru/?parameter-1=Value-A