チェックボックスの全選択/解除について

お尋ねします。
チェックボックスの全選択/解除について

１画面にチェックボックスのグループが複数（store、item）あります。
下記のソースだと【store】の全選択を押下すると【store】【item】両方とも
全選択状態になります。

【store】の全選択/全解除は【store】のみ
【item】の全選択/全解除は【item】のみにしたいのですが
どのようにするとよろしいのでしょうか？

よろしくお願いします。

<SCRIPT TYPE="text/javascript">
<!--
function allcheck(targetForm,flag){
　for(n=0;n<=targetForm.length-1;n++){
　　if(targetForm.elements[n].type == "checkbox"){
　　　targetForm.elements[n].checked = flag;
　　}
　}
}
-->
</SCRIPT>

<table width="70%" align = "center" cellspacing="0">
<form action="confirm.php" method="post" target="_blank">
<tr>
<td align="center">
<input type="checkbox" name="store[]" value="1" />A店<br/>
<input type="checkbox" name="store[]" value="2" />B店<br/>
<input type="checkbox" name="store[]" value="3" />C店<br/>
<input type="checkbox" name="store[]" value="4" />D店<br/>
<input type="checkbox" name="store[]" value="5" />E店<br/>
<input type="button" value="全選択" onClick="allcheck(this.form,true)"/><br>
<input type="button" value="全解除" onClick="allcheck(this.form,false)"/>
</td>
<td align="center">
<input type="checkbox" name="item[]" value="1" />項目１<br/>
<input type="checkbox" name="item[]" value="2" />項目２<br/>
<input type="checkbox" name="item[]" value="3" />項目３<br/>
<input type="checkbox" name="item[]" value="4" />項目４<br/>
<input type="checkbox" name="item[]" value="5" />項目５<br/>
<input type="button" value="全選択" onClick="allcheck(this.form,true)"/><br>
<input type="button" value="全解除" onClick="allcheck(this.form,false)"/>
</td>
</tr>
<tr align="center">
<td colspan="4">
<input type="submit" name="con" value="確認">
</td>
</tr>
</form>
</table>

No.1 回答者： yambejp 回答日時： 2009/08/05 17:55

グルーピングの仕方次第かなぁ・・・

<SCRIPT TYPE="text/javascript">
function allcheck(obj,flag){
var target=obj.parentNode.getElementsByTagName("input");
for(var i=0;i<target.length;i++){
if(target[i].type=="checkbox") target[i].checked=flag;
}
}
</SCRIPT>

<form action="confirm.php" method="post" target="_blank">
<table width="70%" align = "center" cellspacing="0">
<tr>
<td align="center">
<input type="checkbox" name="store[]" value="1" />A店<br/>
<input type="checkbox" name="store[]" value="2" />B店<br/>
<input type="checkbox" name="store[]" value="3" />C店<br/>
<input type="checkbox" name="store[]" value="4" />D店<br/>
<input type="checkbox" name="store[]" value="5" />E店<br/>
<input type="button" value="全選択" onClick="allcheck(this,true)"/><br>
<input type="button" value="全解除" onClick="allcheck(this,false)"/>
</td>
<td align="center">
<input type="checkbox" name="item[]" value="1" />項目１<br/>
<input type="checkbox" name="item[]" value="2" />項目２<br/>
<input type="checkbox" name="item[]" value="3" />項目３<br/>
<input type="checkbox" name="item[]" value="4" />項目４<br/>
<input type="checkbox" name="item[]" value="5" />項目５<br/>
<input type="button" value="全選択" onClick="allcheck(this,true)"/><br>
<input type="button" value="全解除" onClick="allcheck(this,false)"/>
</td>
</tr>
<tr align="center">
<td colspan="4">
<input type="submit" name="con" value="確認">
</td>
</tr>
</table>
</form>

この回答へのお礼

yambejpさんへ

無事にグループごとの選択・解除が
実現できました。
お世話になりました。

お礼日時：2009/08/06 09:59