Вопрос чайника. Как пометить все чекбоксы?

Nikoshka · 19 май 2006, 09:06

Собственно есть документ с кнопкой и много чекбоксов. Нужно при нажатии на кнопку их все сделать отмеченными, вот только я совершенно непонимаю, как это организовать до конца:

Код: Выделить всё

<script type="text/javascript" language="javascript">
function selectall(down) {
//Как сделать эту функцию? Т.е. как нажать эти чекбоксы?
//Пока я открываю документ, чтобы начать работу с ним и закрываю, но что внутри...

document.open();
document.writeln("<img sr='myimage.gif'>");
document.close();

}
</script>

<body>
<button onmoysedown="selectall(1);" type="button">Отметить все</button>
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
</body>

В функции я передаю один парамет "1" так как пока точно незнаю, что передавать...

Zromantmp · 19 май 2006, 13:32

сособов масса.
1) Можно присвоить всем чекбоксам id, отличающиеся толко последней цифрой, а в функции selecall оббежать их все через document.getElementById()
2) Но лучше запихнуть чекбоксы в форму (например, myform), присвоить им одинаковый name (например mycheckbox) и оббежать массив document.myform.mycheckbox[]

Nikoshka · 19 май 2006, 13:56

document.getElementById()

А как она выглядит? И соответствует это стандартам DOM2? Мне сказали, что пользоваться им более перспективно но что-то не нашел я такого в нем...
Как правильно записать эту функцию? Т.е. указать ему на все чекбоксы и какие параметры ей надо переать?

Zromantmp · 19 май 2006, 14:29

Точно не знаю, но вроде должна соответствовать. В неё передаётя строка с id того элемента который ищется.

Oscar · 19 май 2006, 21:05

Nikoshka,

1. Будешь использовать document.write - проблем не оберёшься
2. language="javascript" у тэга script - устаревший параметр, браузеры его игнорируют
3. type="text/javascript" - где-то читал, что это нужно только для DOCTYPE XHTML, точнее сказать не могу

4. Не помню почему, но тэгу button я не доверяю (кажется в какой-то браузер его не понемал),
вместо него надёжнее, ИМХО, писать: <input type="button">

5. Что за интересный параметр SR у тэга img ? :-)
И вообще, скажи, зачем тебе этот рисуночек нужен, и я скажу, как его правильно вставить.

6. И что же происходит по чудесному событию onmoYsedown ? ))))
даже если правильно написать, то я считаю, что selectall должна вызываться по onClick ..

Oscar · 19 май 2006, 21:16

По теме:

Код: Выделить всё

<script>
var selected = false;

function toggleSelect(){

	if (!selected) {

		var checkBoxes = document.getElementsByName("something");

		for(var i = 0 ; i < checkBoxes.length; i++) {

			checkBoxes[i].checked = "checked";

		}

		var checkAllButton = document.getElementById("checkAll");

		checkAllButton.value = "Deselect All";

		selected = true;

	} else {

		var checkBoxes = document.getElementsByName("something");

		for(var i = 0 ; i < checkBoxes.length; i++) {

			checkBoxes[i].checked = null;

		}

		var checkAllButton = document.getElementById("checkAll");

		checkAllButton.value = "Select All";

		selected = false;

	}

}
</script>

<body>
<form>
<input id="checkAll" type="button" value="Select All" onClick="toggleSelect();">

<input name="something" value="1" type="checkbox">

<input name="something" value="2" type="checkbox">

<input name="something" value="3" type="checkbox">

<input name="something" value="4" type="checkbox">

</form>
</body>

Nikoshka · 21 май 2006, 06:18

Код: Выделить всё

<script>
var selected = false;

function toggleSelect(){

   if (!selected) {

А вот тут несовем понятно, почему обнуляем переменную?
Если мы будем жать на кнопку то будет выполняться только функция или как в php с самого начала скрипт?

Duncon · 21 май 2006, 12:40

Усложнили все - без особой обходимости киллометр кода не нужен по событию onClick="selectall"
<input type ="CheckBox" onclick = "SelectAll()">

если нужно выделять по группам можно функцию дописать

Код: Выделить всё

<script type="text/javascript">
<!--
/**
* cont  - ссылка на контейнер
* name   - опционально, выбрать чекбоксы с определённым именем
*/
function selectAll(cont, name) {
  var inpts=cont.getElementsByTagName("INPUT");
  for(var i=0; i<inpts.length; i++)
    if(inpts[i].type=="checkbox" && (name==null||inpts[i].name==name)) inpts[i].checked=true; 
}
//-->
</script>
<div id="chks">
<input type="checkbox" name="selected_firms[]" value="1">
<input type="checkbox" name="selected_firms[]" value="2">
<input type="checkbox" name="group2_firms[]" value="3">
<input type="checkbox" name="group2_firms[]" value="4">
<input type="checkbox" name="selected_firms[]" value="5">

<button onClick="selectAll(this.parentNode)">Select All</button>
<button onClick="selectAll(this.parentNode, 'group2_firms[]')">Select group 2</button>
</div>

Nikoshka · 21 май 2006, 13:34

Duncon,
А почему у вас OnClick а не onmousedown?
И вот это значение: "checked" зарезервированное или нет? Модно ли поставить 1 или 0 или true и все будет валидно?

И еще вопрос. Вы пишите так, что передается ссылка на данный документ, хотя я наше, что можно прямо обратиться ко всему документу:

Код: Выделить всё

document.getElementById(i);

т.е. всем тегам я присвоил id и соответственно всех их так выделяю. Только я пришл к выводу, что непонимаю что вообще передать в процедуру и надо ли что-то передавать?

Хочу сам написать, но много вещей непонимаю абсолютно:

Код: Выделить всё

<input type="button" OnClick="selectAll();" value="button">
<script type="text/javascript" language="javascript">
function selectAll {
for(var i=1; i<4; i++) {
var box = document.getElementById("i");
box.checked = true;
}}
</script>






<table style="width:100px;height:15px;border:1px solid grey;" border="0" cellspacing="0" cellpadding="4">
<tr>
<tr><td><input id="1" type="checkbox"><input type="checkbox"></td><td><input type="checkbox"></td></tr>
<tr><td><input id="2" type="checkbox"><input type="checkbox"></td><td><input type="checkbox"></td></tr>
<tr><td><input id="3" type="checkbox"><input type="checkbox"></td><td><input type="checkbox"></td></tr>
<tr><td><input id="4" type="checkbox"><input type="checkbox"></td><td><input type="checkbox"></td></tr>
</table>

Вот есть id у чекбоксов, при выполнении события onclick в процедуру ничего не передается, но она все равно выполняется, вроде как ее затронули. Потом в процедуре через цикл мы выбираем id и получаем соответствующий элемент, потом присваиваем то, что получилось переменной box и она является как бы тем самым чекбоксом, потом обращаемся к атрибуту. Вроде бы все ок...

Duncon · 21 май 2006, 23:25

Nikoshka писал(а):Duncon,
А почему у вас OnClick а не onmousedown?
И вот это значение: "checked" зарезервированное или нет? Модно ли поставить 1 или 0 или true и все будет валидно?

Это разные методы OnClick - при щелчке, onmousedown - когда кнопка мыши вжата... Использовать можно на свое усмотрение, единственное у меня в голове пожизненная каша из-за постоянной работы с разными языками - метод (onmousedown) может и не работать нужно на практике проверить.(хотя чего ему не работать...)..
"checked" зарезервированно...поставить 1 или 0 - Это в какой "форме" так писать?...

Nikoshka писал(а): И еще вопрос. Вы пишите так, что передается ссылка на данный документ, хотя я наше, что можно прямо обратиться ко всему документу:

Код: Выделить всё

document.getElementById&#40]
т.е. всем тегам я присвоил id и соответственно всех их так выделяю. Только я пришл к выводу, что непонимаю что вообще передать в процедуру и надо ли что-то передавать?[/quote]
Не совсем понял что ввиду имеешь...
[quote="Nikoshka"]
Хочу сам написать, но много вещей непонимаю абсолютно:
[code]
<input type="button" OnClick="selectAll&#40]

Вот есть id  у чекбоксов, при выполнении события onclick в процедуру ничего не передается, но она все равно выполняется, вроде как ее затронули. Потом в процедуре через цикл мы выбираем id и получаем соответствующий элемент, потом присваиваем то, что получилось переменной box и она является как бы тем самым чекбоксом, потом обращаемся к атрибуту. Вроде бы все ок...[/quote]
Ну обычно форма направляется в некий скрипт, а он в свою очередь разруливает что куда, конкретней задачу...

Про то что ты не понимаешь, пиши объясню построчно...