Разобрать значения фильтров из url и расставить их по соответствующим полям

[ar4ipers]

Здравствуйте, из нужно из url разобрать значения фильтров и расставить их по соответствующим полям. С checkbox и radio разобрался. а вот с select-ом не могу чет понять. мжет подскажет кто?

<form>
    <p><input name="size" type="radio" value="S"> S</p>
    <p><input name="size" type="radio" value="M"> M</p>
    <p><input name="size" type="radio" value="L"> L</p>
    <p><input type="checkbox" name="color" value="1">1</p>
    <p><input type="checkbox" name="color" value="2">2</p>
    <p><input type="checkbox" name="color" value="3">3</p>
    <p><input type="checkbox" name="color" value="4">4</p>
    <p><select multiple="multiple" size=4 name="manufacturer">
        <option value="aaa">aaa</option>
        <option value="b&c">b&c</option>
        <option value="ddd">ddd</option>
        <option value="eee">eee</option>
    </select></p>
    <p><input type="checkbox" name="sale" value="1">Распродажа</p>  
</form>

const   checkboxes = document.querySelectorAll('[name="color"]'),
            radios = document.querySelectorAll('[name="size"]');


    let url = new URL('http://любой_домен/filter?size=M&color=2,3&manufacturer=aaa,eee'),
        searchParams = new URLSearchParams(url.search),
        size = searchParams.get('size'),
        colors = searchParams.get('color').split(','),
        manufacturers = searchParams.get('manufacturer').split(',');

    let len1 = checkboxes.length,
        len2 = colors.length,
        len3 = radios.length;
    for (var i = 0; i < len1, i < len3; i++) {
        if (radios[i].value == size) radios[i].checked = true;
        for (let j = 0; j < len2; j++) {
            if (checkboxes[i].value == colors[j]) checkboxes[i].checked = true;
        }
    }

[Dilettante_Pro]

<form>
    <p><input name="size" type="radio" value="S"> S</p>
    <p><input name="size" type="radio" value="M"> M</p>
    <p><input name="size" type="radio" value="L"> L</p>
    <p><input type="checkbox" name="color[]" value="1">1</p>
    <p><input type="checkbox" name="color[]" value="2">2</p>
    <p><input type="checkbox" name="color[]" value="3">3</p>
    <p><input type="checkbox" name="color[]" value="4">4</p>
    <p><select multiple="multiple" size=4 name="manufacturer">
        <option value="aaa">aaa</option>
        <option value="b&c">b&c</option>
        <option value="ddd">ddd</option>
        <option value="eee">eee</option>
    </select></p>
    <p><input type="checkbox" name="sale" value="1">Распродажа</p>  
</form>
<script>
const   checkboxes = document.querySelectorAll('[name="color[]"]'),
            radios = document.querySelectorAll('[name="size"]'),
            options = document.querySelectorAll('[name="manufacturer"] option');


    let url = new URL('http://любой_домен/filter?size=M&color=2,3&manufacturer=aaa,eee'),
        searchParams = new URLSearchParams(url.search),
        size = searchParams.get('size'),
        colors = searchParams.get('color').split(','),
        manufacturers = searchParams.get('manufacturer').split(',');

    let len1 = checkboxes.length,
        len2 = colors.length,
        len3 = radios.length,
        len4 = manufacturers.length,
        len5 = options.length;
    for (var i = 0; i < len1, i < len3; i++) {
        if (radios[i].value == size) radios[i].checked = true;
        for (let j = 0; j < len2; j++) {
            if (checkboxes[i].value == colors[j]) checkboxes[i].checked = true;
        };
    };
    for (var i = 0; i < len5; i++) {
        for (let j = 0; j < len4; j++) {
            if (options[i].value == manufacturers[j]) options[i].selected = true;
        }
     };
</script>

[j0hnik]

Dilettante_Pro,

можно чуть проще чем цикл в цикле

<form>
	<p><input name="size" type="radio" value="S"> S</p>
	<p><input name="size" type="radio" value="M"> M</p>
	<p><input name="size" type="radio" value="L"> L</p>
	<p><input type="checkbox" name="color[]" value="1">1</p>
	<p><input type="checkbox" name="color[]" value="2">2</p>
	<p><input type="checkbox" name="color[]" value="3">3</p>
	<p><input type="checkbox" name="color[]" value="4">4</p>
	<p><select multiple="multiple" size=4 name="manufacturer">
		<option value="aaa">aaa</option>
		<option value="b&c">b&c</option>
		<option value="ddd">ddd</option>
		<option value="eee">eee</option>
	</select></p>
	<p><input type="checkbox" name="sale" value="1">Распродажа</p>  
</form>
<script>
	const   checkboxes = document.querySelectorAll('[name="color[]"]'),
	radios = document.querySelectorAll('[name="size"]'),
	options = document.querySelectorAll('[name="manufacturer"] option');


	let url = new URL('http://любой_домен/filter?size=M&color=2,3&manufacturer=aaa,eee'),
	searchParams = new URLSearchParams(url.search),
	size = searchParams.get('size'),
	colors = searchParams.get('color').split(','),
	manufacturers = searchParams.get('manufacturer').split(',');

	let len1 = checkboxes.length,
	len2 = colors.length,
	len3 = radios.length,
	len4 = manufacturers.length,
	len5 = options.length;
	for (var i = 0; i < len1, i < len3; i++) {
		if (radios[i].value == size) radios[i].checked = true;
		for (let j = 0; j < len2; j++) {
			if (checkboxes[i].value == colors[j]) checkboxes[i].checked = true;
		};
	};

	options.forEach(el=>{
		if(manufacturers.includes(el.value))  el.selected = true;
	});

</script>

[Dilettante_Pro]

j0hnik,
Можно, конечно. Просто я написал в стиле ТС