Форум

unity555 · #1 (**permalink**) 01.12.2017, 01:52

У меня есть форма и куча чекбоксов в ней.
Чекбоксы имеют одинаковые параметры (копии).

form method="post" action="action.php"  name="checkbox_form" class="checkbox_form">
 
<input type="checkbox" name="ch_1"  class="my_checkbox"  value="ch_1" checked>
<input type="checkbox" name="ch_1"  class="my_checkbox"  value="ch_1" checked>
 
<input type="checkbox" name="ch_2"  class="my_checkbox"  value="ch_2">
<input type="checkbox" name="ch_2"  class="my_checkbox"  value="ch_2">
<!-- И тут ещё куча копий -->
</form>

Мне нужно по нажатию на чекбокс (т.е. снятие или выделение) снять/выделить все чекбоксы с одинаковым именем/классом.
И отправить (submit) форму.

То есть отловить событие клика/изменения элемента с классом my_checkbox.
Получить его состояние (checked?) и получить его имя (например ch_1).
Изменить его состояние и всех элементов с таким именем на противоположное (все чекбоксы с именем ch_1 теперь unchecked).
Отправить форму checkbox_form.

Есть идеи, как это реализовать?
К сожалению, я потерял подобный код. Да и возникает некоторая сложность т.к. нужно изменять состояние не одного чекбокса, а множества...

Заранее спасибо за ответы.

void() · #2 (**permalink**) 01.12.2017, 02:47

Так?

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<form method="post" action="action.php"  name="checkbox_form" class="checkbox_form">

		<input type="checkbox" name="ch_1"  class=my_checkbox"  value="ch_1" checked>
		<input type="checkbox" name="ch_1"  class="my_checkbox"  value="ch_1" checked>

		<input type="checkbox" name="ch_2"  class="my_checkbox"  value="ch_2">
		<input type="checkbox" name="ch_2"  class="my_checkbox"  value="ch_2">
		<!-- И тут ещё куча копий -->
	</form>

	<script>
		window.onload = function(){
			var elems = document.querySelectorAll('.my_checkbox');
			for(var i = 0; i < elems.length; i++){
				elems[i].onchange = go;
			}

			function go() {
				var name = this.getAttribute('name');
				var check = this.checked;
				checkAll(name, check);
			}

			function checkAll(name, check){
				var names = document.getElementsByName(name);
				for(var k = 0; k < names.length; k++){
					names[k].checked = check;
				}
				// Тут отправляем форму
			}
		}
	</script>
</body>
</html>

unity555 · #3 (**permalink**) 01.12.2017, 12:19

Сообщение от void()

Так?

Да. Спасибо.

PS
Я там допустил опечатку, забыл ". Исправил свой первый пост.

class=my_checkbox"

а надо

class="my_checkbox"

Dilettante_Pro · #4 (**permalink**) 01.12.2017, 13:12

unity555,
Зачем же у вас элементы в форме с одинаковыми именами? Отправление из формы формируется по именам....
Это только radio объединяется в группу по общему имени

Форум

Справочник

Discord чат

Курсы javascript