Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Управление состоянием множества checkbox 'ов с помощью одного checkbox 'са. (https://javascript.ru/forum/dom-window/12842-upravlenie-sostoyaniem-mnozhestva-checkbox-%27ov-s-pomoshhyu-odnogo-checkbox-%27sa.html)

soad 05.11.2010 09:16

Управление состоянием множества checkbox 'ов с помощью одного checkbox 'са.
 
Никак не могу реализовать такую хрень: допустим у нас есть три флажка (checkbox) , назавём их "a", "b" и "c". Мне нужно чтобы при активировании флажка "а" автоматически активировались флажки "b" и "с", и что самое главное (что не получается реализовать), чтобы при деактивировании флажка "а" автоматически деактивировались флажки "b" и "с". Примером может быть страници mail,ru, где изображён список писем (например "входящие") . Там можно поставить галочку на любом письме независемо друг от друга, но когда ставишь галочку в заголовка, то и на всех письмах автоматом ставятся галочки, ну и естественно при снятии флажка с заголовка флажки автоматом снимается и со всех писем. Зарание всем спасибо !!!
------------------------------------------------------------
<script>
function act()
{
document.form.b.checked="checked";
document.form.c.checked="checked";
}
</script>
<form name="form">
<input type="checkbox" onclick="act();" id="a"><br>
<input type="checkbox" id="b">
<input type="checkbox" id="c">
</form>
------------------------------------------------------------
Вэтом примере при активации флажка с id="a" автоматом активируются флажки с id="b" и id="c". А как сделать чтобы при деактивации флажка с id="a" автоматом деактивируются флажки с id="b" и id="c" ??

ksa 05.11.2010 09:22

Цитата:

Сообщение от soad
Никак не могу реализовать такую .....

Показал бы пример того, что ты делаешь... Задачка-то букварская.

soad 05.11.2010 10:11

пример добавлен

DooMer 05.11.2010 10:52

<script>
function act(v)
{
document.form.b.checked=v;
document.form.c.checked=v;
}
</script>
<form name="form">
<input type="checkbox" onclick="act(this.checked);" id="a"><br>
<input type="checkbox" id="b">
<input type="checkbox" id="c">
</form>

2de 05.11.2010 11:26

soad,
вместо "checked" нужно писать true или false

ksa 05.11.2010 18:29

soad, как вариант...

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>12345</title>
<style type="text/css">
</style>
<script>
function act() {
	var o=document.getElementById('frm')
	o=o.getElementsByTagName('input')
	var val=document.getElementById('a').checked
	var i
	for (i=1; i<o.length; i++) {
		o[i].checked=val
	}
}
</script>
</head>
<body>
<form id="frm">
	<input type="checkbox" onclick="act();" id="a" />
	<br />
	<input type="checkbox" id="b" />
	<input type="checkbox" id="c" />
</form>
</body>
</html>

vladlen 11.11.2010 03:46

<script>
function act(v){
	document.forms['form'].b.checked = v;
	document.forms['form'].c.checked = v;
}
</script>
<form name="form">
<input type="checkbox" onclick="act(this.checked);" id="a"><br>
<input type="checkbox" id="b">
<input type="checkbox" id="c">
</form>

ksa 11.11.2010 09:07

vladlen, аесли чекбоксов будет больше? Опять программку будешь менять?

Predator 01.09.2012 17:29

Проще всего реализовать это на jQuery.

Для этого всем чекбоксам, которые должны будут выделяться, нужно прописать класс class='checks_all'
Пример:
...
<input type='checkbox' name='c0'  class='checks_all' />
<input type='checkbox' name='c1'  class='checks_all' />
<input type='checkbox' name='c2'  class='checks_all' />
<input type='checkbox' name='c3'  class='checks_all' />
<input type='checkbox' name='c4'  class='checks_all' />

<input type='checkbox' id='check_all' /> Выделить все

<script type=\"text/javascript\">
$(document).ready(function() {
    $('#check_all').click(function () {
         if (!$('#check_all').is(':checked'))
              $('.checks_all').removeAttr('checked');
        else 
              $('.checks_all').attr('checked','checked');
        });
});
</script>
...

При нажатии на чекбокс «Выделить все» будут отмечаться все чекбоксы с классом class='checks_all', при повторном нажатии все флажки снимутся. :victory:


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