Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Управление массивами чекбоксов, Необходимо отключить чекбоксы в контексте группы (https://javascript.ru/forum/misc/4825-upravlenie-massivami-chekboksov-neobkhodimo-otklyuchit-chekboksy-v-kontekste-gruppy.html)

Mamba 23.08.2009 14:37

Управление массивами чекбоксов, Необходимо отключить чекбоксы в контексте группы
 
Существует динамический формируемый массив чекбоксов, например:

<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).
При этом колличество активных груп и тех которые должны отключаться тоже в перспективе должно масштабироваться.

Подскажите как их перебрать таким образом?
Спасибо!

alexKniaz 23.08.2009 16:29

<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;
   }
  }
 }
}

Mamba 23.08.2009 23:14

Почемуто не работает :( пробовал сам перебрать но нехватаят знаний.

Проверочный алерт уже не работает после строки var p2=par.parent;

Octane 24.08.2009 00:04

parentNode, а не просто parent

Mamba 24.08.2009 00:28

Спасибо большое! Продвинулся немного! :)



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

Octane 24.08.2009 00:51

Ну что же вы каждую опечатку будете на форуме постить, 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>

Mamba 24.08.2009 06:13

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;
              	}	  
			}	  
	  
	  }


Добавил проверку чекнуты вооще ли какие чекбоксы и по ним отключение дисейбла...

Спасибо большое за помощь! :)

Mamba 24.08.2009 16:50

Еще вопрос по ходу возник, как сделать, чтобы две группы (div) не отключались а все остальные дисейблились?
Ломаю голову и из того что есть не могу выкрутится :(

alexKniaz 24.08.2009 16:52

Вытащить эти два дива за пределы группы. Самый простой вариант

JSprog 24.08.2009 16:53

Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:
[js]
... ваш код...
[/js]


О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.


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