Выбрать из списка объект и перейти на страницу этого объекта?

Question

[Xsandersoff]

Добрый день. Два месяца, как начал изучать фронтенд. С html и css проблем особых не возникает, хотя бы есть понимание, что да как. Приступил к JS и прям затык какой то. Логику, вроде, понимаю, но как это в коде отразить.... Пока тупик. Решил сделать небольшую игру и под каждое действие искать информацию, как сделать это в js, может так придёт понимание. Нужна помощь в простейшие (для вас) действии.
Задача:
Есть некий список лиц и не активная кнопка:

<div class="one"><input type="radio" id="a" value="aa"><\div>
<div class="one"><input type="radio" id="b" value="bb"><\div>
<div class="one"><input type="radio" id="c" value="cc"><\div>
<button>Подтвердить<\button>

Нужно, чтобы при выборе, например, b активировалась кнопка "Подтвердить" и при нажатии на эту кнопку переходить на страницу с информацией о b (будет некий профиль с фото, именем, фамилией, возрастом) но это я сам попробую сделать)))) в будущем!
Заранее спасибо.

Answer 1

[Александр]

В таком случае, для начала, оберните инпуты в форму и дайте всем одинаковый name, иначе смысл какой делать type="radio"? В событии формы - submit можно уже что-то делать с выбранными значениями.

<form>
	<label>
		<input type="radio" name="gender" value="male">
		Мужской
	</label>
	<label>
		<input type="radio" name="gender" value="female">
		Женский
	</label>
  <button>Отправить</button>
</form>

const form = document.querySelector('form');

form.addEventListener('submit', event => {
	event.preventDefault();
  
  const data = new FormData(form);
  
  alert(data.get('gender'));
});

Comments

[Xsandersoff]

Спасибо. Буду разбирать Ваш код, что да как работает)))