Управление массивами чекбоксов, Необходимо отключить чекбоксы в контексте группы
Существует динамический формируемый массив чекбоксов, например:
<input id="1" name="1" type="checkbox"> <input id="1_1" name="1_1" type="checkbox"> <input id="1_2" name="1_2" type="checkbox"> <input id="1_3" name="1_3" type="checkbox"> <input id="1_4" name="1_4" type="checkbox"> <input id="1_5" name="1_5" type="checkbox"> <input id="1_6" name="1_6" type="checkbox"> <input id="2" name="2" type="checkbox"> <input id="2_1" name="2_1" type="checkbox"> <input id="2_2" name="2_2" type="checkbox"> <input id="2_3" name="2_3" type="checkbox"> <input id="3" name="3" type="checkbox"> <input id="3_1" name="3_1" type="checkbox"> <input id="3_2" name="3_2" type="checkbox"> <input id="3_3" name="3_3" type="checkbox"> <input id="3_4" name="3_4" type="checkbox"> <input id="3_5" name="3_5" type="checkbox"> Необходимо при выборе любого чекбокса в одной группе все остальные группы отключить (disabled=true). При этом колличество активных груп и тех которые должны отключаться тоже в перспективе должно масштабироваться. Подскажите как их перебрать таким образом? Спасибо! |
<div id="checboxes"> <div id="ch_group1"> <input id="1" name="1" type="checkbox"> <input id="1_1" name="1_1" onclick="chclick(this);" type="checkbox"> <input id="1_2" name="1_2" onclick="chclick(this);" type="checkbox"> <input id="1_3" name="1_3" onclick="chclick(this);" type="checkbox"> <input id="1_4" name="1_4" onclick="chclick(this);" type="checkbox"> <input id="1_5" name="1_5" onclick="chclick(this);" type="checkbox"> <input id="1_6" name="1_6" onclick="chclick(this);" type="checkbox"> </div> <div id="ch_group2"> <input id="2" name="2" onclick="chclick(this);" type="checkbox"> <input id="2_1" name="2_1" onclick="chclick(this);" type="checkbox"> <input id="2_2" name="2_2" onclick="chclick(this);" type="checkbox"> <input id="2_3" name="2_3" onclick="chclick(this);" type="checkbox"> </div> <div id="ch_group3"> <input id="3" name="3" onclick="chclick(this);" type="checkbox"> <input id="3_1" name="3_1" onclick="chclick(this);" type="checkbox"> <input id="3_2" name="3_2" onclick="chclick(this);" type="checkbox"> <input id="3_3" name="3_3" onclick="chclick(this);" type="checkbox"> <input id="3_4" name="3_4" onclick="chclick(this);" type="checkbox"> <input id="3_5" name="3_5" onclick="chclick(this);" type="checkbox"> </div> </div> Вот скрипт: function chclick(obj){ var par=obj.parent; var p2=par.parent; for(i=1;i<p2.childNodes.length;i++){ if(p2.childNodes.item(i).nodetype==1){ if(p2.childNodes.item(i).id==par.id){ p2.childNodes.item(i).disabled=false; } else{ p2.childNodes.item(i).disabled=true; } } } } |
Почемуто не работает :( пробовал сам перебрать но нехватаят знаний.
Проверочный алерт уже не работает после строки var p2=par.parent; |
parentNode, а не просто parent
|
Спасибо большое! Продвинулся немного! :)
function chclick(obj) { var par=obj.parentNode; var p2=par.parentNode; for(i=1; i<p2.childNodes.length; i++) { alert(p2.childNodes.item(i).nodetype); if(p2.childNodes.item(i).nodetype==1) { if(p2.childNodes.item(i).id==par.id) { p2.childNodes.item(i).disabled=false; } else { p2.childNodes.item(i).disabled=true; } } } alert(p2.childNodes.length); } Скрипт не заработал :( Проверяю - теперь alert(p2.childNodes.item(i).nodetype) выдает Undefined -- из чего я понимаю что чтото не так в обращении к child |
Ну что же вы каждую опечатку будете на форуме постить, nodeType пишется, но там ошибка не в этом.
И вообще мне лень разбираться в чужом коде, в данном случае проще свой написать: <div> <script type="text/javascript"> function chclick(node) { var group = node.parentNode; var checkboxes = group.parentNode.getElementsByTagName("input"); var i = checkboxes.length; while(i--) { if(checkboxes[i].parentNode != group) { checkboxes[i].disabled = true; } } } </script> <div> <input onclick="chclick(this)" type="checkbox" /> <input onclick="chclick(this)" type="checkbox" /> <input onclick="chclick(this)" type="checkbox" /> <input onclick="chclick(this)" type="checkbox" /> <input onclick="chclick(this)" type="checkbox" /> <input onclick="chclick(this)" type="checkbox" /> <input onclick="chclick(this)" type="checkbox" /> </div> <div> <input onclick="chclick(this)" type="checkbox" /> <input onclick="chclick(this)" type="checkbox" /> <input onclick="chclick(this)" type="checkbox" /> <input onclick="chclick(this)" type="checkbox" /> </div> <div> <input onclick="chclick(this)" type="checkbox" /> <input onclick="chclick(this)" type="checkbox" /> <input onclick="chclick(this)" type="checkbox" /> <input onclick="chclick(this)" type="checkbox" /> <input onclick="chclick(this)" type="checkbox" /> <input onclick="chclick(this)" type="checkbox" /> </div> </div> |
function chclick(node) { var group = node.parentNode; var checkboxes = group.parentNode.getElementsByTagName("input"); var i = checkboxes.length; var e = i; var check = ''; while(i--) { if(checkboxes[i].checked == true) { check = 'yes'; } } if (check == 'yes') { while(e--) { if(checkboxes[e].parentNode != group) { checkboxes[e].disabled = true; } } } else { while(e--) { checkboxes[e].disabled = false; } } } Добавил проверку чекнуты вооще ли какие чекбоксы и по ним отключение дисейбла... Спасибо большое за помощь! :) |
Еще вопрос по ходу возник, как сделать, чтобы две группы (div) не отключались а все остальные дисейблились?
Ломаю голову и из того что есть не могу выкрутится :( |
Вытащить эти два дива за пределы группы. Самый простой вариант
|
Пожалуйста, отформатируйте свой код!
Для этого его можно заключить в специальные теги: js/css/html и т.п., например: [js] ... ваш код... [/js] О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting. |
Часовой пояс GMT +3, время: 17:54. |