Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Изменить урл без перезагрузки страницы при выборе input type="radio" (https://javascript.ru/forum/misc/78603-izmenit-url-bez-perezagruzki-stranicy-pri-vybore-input-type%3D-radio.html)

max1985 08.10.2019 20:06

Изменить урл без перезагрузки страницы при выборе input type="radio"
 
Здравствуйте!
Есть список радиокнопок когда я нахожусь на странице /item/promote?id=15895&from=view. Надо при нажатие на кнопку переходить на тот же урл с приставкой ?check=id (в роли id у меня value), желательно без перезагрузки страницы...
Как это можно реализовать? Спасибо!

Пока сделал так, но страница перезагружается и не делается выбор...
<input type="radio" onclick="window.location='/item/promote?id=15895&from=view?check=1'" name="svc" autocomplete="off" value="1" class="j-check">
<input type="radio" onclick="window.location='/item/promote?id=15895&from=view?check=2'" name="svc" autocomplete="off" value="2" class="j-check">
<input type="radio" onclick="window.location='/item/promote?id=15895&from=view?check=3'" name="svc" autocomplete="off" value="3" class="j-check">

Malleys 08.10.2019 23:38

<input type="radio" name="check" value="1" class="j-check">
<input type="radio" name="check" value="2" class="j-check">
<input type="radio" name="check" value="3" class="j-check">

<script>

addEventListener("change", event => {
	const url = new URL(location);
	url.searchParams.set(event.target.name, event.target.value);
	history.replaceState(null, null, url);
});

</script>
Достаточно добавить этот скрипт только один раз! Обрабатывает изменения всех полей ввода, добавьте условие, если нужно только определённые поля.

max1985 09.10.2019 08:05

Цитата:

Сообщение от Malleys (Сообщение 513714)
[HTML run]<input type="radio" name="check" value="1" class="j-check">Достаточно добавить этот скрипт только один раз! Обрабатывает изменения всех полей ввода, добавьте условие, если нужно только определённые поля.

Спасибо! Работает!

nenado88 22.04.2023 13:42

Цитата:

Сообщение от Malleys (Сообщение 513714)
<input type="radio" name="check" value="1" class="j-check">
<input type="radio" name="check" value="2" class="j-check">
<input type="radio" name="check" value="3" class="j-check">

<script>

addEventListener("change", event => {
	const url = new URL(location);
	url.searchParams.set(event.target.name, event.target.value);
	history.replaceState(null, null, url);
});

</script>
Достаточно добавить этот скрипт только один раз! Обрабатывает изменения всех полей ввода, добавьте условие, если нужно только определённые поля.



Крутое решение!
Подскажите пожалуйста, а если в url уже стоит параметр "?" но скрыт через htacsess, как быть?

Например:

site.ru/catalog/iphone (на самом деле выглядит так: site.ru/catalog.php?url=iphone)

И когда я выполняю ваш скрипт, получается так:

site.ru/catalog/iphone?check=3 (на самом деле выглядит так: site.ru/catalog.php?url=iphone?check=3)

Надо что бы второй "?" заменялся на "&"
Как это можно реализовать?

nenado88 22.04.2023 13:42

Не могу понять
 
Цитата:

Сообщение от Malleys (Сообщение 513714)
<input type="radio" name="check" value="1" class="j-check">
<input type="radio" name="check" value="2" class="j-check">
<input type="radio" name="check" value="3" class="j-check">

<script>

addEventListener("change", event => {
	const url = new URL(location);
	url.searchParams.set(event.target.name, event.target.value);
	history.replaceState(null, null, url);
});

</script>
Достаточно добавить этот скрипт только один раз! Обрабатывает изменения всех полей ввода, добавьте условие, если нужно только определённые поля.



Крутое решение!
Подскажите пожалуйста, а если в url уже стоит параметр "?" но скрыт через htacsess, как быть?

Например:

site.ru/catalog/iphone (на самом деле выглядит так: site.ru/catalog.php?url=iphone)

И когда я выполняю ваш скрипт, получается так:

site.ru/catalog/iphone?check=3 (на самом деле выглядит так: site.ru/catalog.php?url=iphone?check=3)

Надо что бы второй "?" заменялся на "&"
Как это можно реализовать?

рони 06.05.2023 11:28

nenado88,
как вариант заменить location на
https://site.ru/catalog.php?url=iphone


Часовой пояс GMT +3, время: 15:12.