Отметить все

Отметить все

Если предоставляете возможность пользователю, допустим при подписке на
рассылку - выбор категорий рассылки, путем отметки какого - либо из
checkbox'ов или нескольких одновременно, то может возникнуть ситуация:
"А если этих самых категорий будет 10+", я думаю необходимо будет
сделать еще один чекбокс (вверху, либо внизу остальных) - "Выделить
все".



А делается это очень просто с помощью JS:



Напишем небольшую функцию MarkALL(n, id_id, obj)



в которую будем передавать:


n - количество checkbox'ов;

id_id - префикс.

chk - значение checked (True/False) чекбокса, имя которого есть "MarkAll"



В нашем случае префикс "ras_", количество чекбоксов 9 и имя кнопки "Отметить все" - "MarkALL"

<script type="text/javascript">




function MarkALL(n, id_id, chk){

for(var i = 0; i <= n; i++){

document.getElementById(id_id+i).checked = chk; //если кнопка "отметить все" отмечена, то chk будет содержать значение True, в противном случае False
}
}



</script>




<form action="" method="POST" name="rassilka"><fieldset>

<label><input type='checkbox' name="MarkAll"
onclick="MarkALL(9,'ras_',document.rassilka.MarkAll.checked)">
Отметить все</label><br>



<label><input type='checkbox' id='ras_0'> Новости</label><br>


<label><input type='checkbox' id='ras_1'> Комментарии</label><br>

<label><input type='checkbox' id='ras_2'> Форум</label><br>

<label><input type='checkbox' id='ras_3'> Блоги</label><br>


<label><input type='checkbox' id='ras_4'> Чат</label><br>

<label><input type='checkbox' id='ras_5'> Статьи</label><br>

<label><input type='checkbox' id='ras_6'> Новые файлы</label><br>


<label><input type='checkbox' id='ras_7'> и т. д.</label><br>

<label><input type='checkbox' id='ras_8'> и т. п.</label><br>

<label><input type='checkbox' id='ras_9'> наконец конец</label><br>


</fieldset></form>


Т.е. все чекбоксы с префиксом id_id с номером от 0 до N, точнее свойство checked каждого из них, мы обращаем в то состояние, которое присуще document.rassilka.MarkAll.checked (True/False).



Вот и все! Удачи в изучении!

Автор: Бекенов Балтабек (cybri0nix)

0 коментарі:

Отправить комментарий

 
Анализ сайта booksrum.blogspot.com Яндекс.Метрика