２種類のチェックボックスの計算を教えて下さい。

[新着] Webテンプレートを仮オープンしました

0   名前： tosi ： 2006/10/21（土） 09:28  ID:7VBgPpxA
初歩的な質問で申し訳ありませんが自身では解決できないのでお願いします。
２種類のチェックボックスのチェックされたものの合計×数値をページ内で表示したいのですが、name を変えてしまうと計算の仕方が分かりません。１種類だけならなんとか出来ました。

<script Language="JavaScript">
<!--
function calc()
{
//チェックの数を数える
len = 3; //チェックボックスの数

count = 0;
for (i=0; i<len; i++) if (document.myFORM.tosi[i].checked)count++;
total = 1000 * count;
fObj = document.myFORM;
fObj.item_price.value = total;
}
// --></script>
<body>
<form name="myFORM">
<input type="checkbox" name="tosi" onClick="calc()" value="a">a<br>
<input type="checkbox" name="tosi" onClick="calc()" value="b">b<br>
<input type="checkbox" name="tosi" onClick="calc()" value="c">c<br>
b
<input type="hidden" name="default.tosi" value="無し"><br>
合計：<input type=text name="item_price" value="" size=10 readonly>円
</form>
</body>


この中の b のところに

<input type="checkbox" name="tosi2" onClick="calc()" value="a">a<br>
<input type="checkbox" name="tosi2" onClick="calc()" value="b">b<br>
<input type="checkbox" name="tosi2" onClick="calc()" value="c">c<br>

を入れて計算できるようにするにはどのようにしたらよいのでしょうか。
よろしくお願いします。
1   名前： 匿名 ： 2006/10/21（土） 09:28  ID:K326bbkp
だから、そういう省略形だけ覚えても応用が効かないと思うんだ。

document.forms['フォームID'].elements['コントロールNAME']

覚えるならこれ。これなら'tosi'と'tosi2'もすぐに扱えるでしょ？
# 本当はフォームにname/idを振る必要すらないんだが、今は置いとく。
2   名前： tosi ： 2006/10/21（土） 09:28  ID:7VBgPpxA
ありがとうございます。こんなかんじでしょうか。
function check()
{
n = 0;
for (i=0; i<3; i++)
{
flag = document.forms[0].elements["tosi"+i].checked;
if (flag == true) n = n + 1;
}

でもname属性をtosi2に変えてしまうとやはり数えてくれないんです。
tosi と　tosi2　にしておきたいのは入力漏れのチェックと、cgiで確認がめんをつくりたいからなのですが。やっぱり分かりません。この二つを合計するってことも出来るのでしょうか。初心者の質問で申し訳ありません。
3   名前： ABDS ： 2006/10/21（土） 09:28  ID:EnWNHqjc
<script type="text/javascript">
function isArray(obj) {
if(obj == null){
	return false;
}
	
if(obj.length){
	return true;
} else {
	return false;
}
}

function calc()
{
var name1 = "tosi";
var name2 = "tosi2";
var i;
var cnt = 0;

var f = document.forms[0];
var t1 = f.elements[name1];
var t2 = f.elements[name2];
var pl = f.elements["item_price"];
if(isArray(t1)){
	for(i=0;i<t1.length;i++){ 
		if(t1[i].checked){
			cnt = cnt + 1;
		}
	}
}
if(isArray(t2)){
	for(i=0;i<t2.length;i++){ 
		if(t2[i].checked){
			cnt = cnt + 1;
		}
	}
}
pl.value = cnt * 1000;
}

</script>


確認はSleipnir 2.48(エンジンはIE使用)で行っているので動かないブラウザもあると思います。
一応これで動きました。
ですが、チェックするnameが固定なため、このままだとname属性の違うものが増えた時に面倒ですので。
4   名前： 匿名 ： 2006/10/21（土） 09:28  ID:K326bbkp
>>2
'tosi1'、'tosi2'というコントロール名の付け方と、
'tosi1'、'tosi2'というコントロールがそれぞれ何個ずつあるかは別問題でしょ。

function calc (form) {
	var maxIndex = 2; // tosi1..tosi2まで
	var count = 0;

	for (var i = 0; i < maxIndex; i++) {
		var tosiN = form.elements['tosi' + i];

		for (var j = 0, len = tosiN.length; j < len; j++) {
			if (tosiN[j].checked) count++;
		}
	}
    
	form.elements['item_price'].value = 1000 * count;
}

<!-- 引数としてinput要素が属するフォームを渡す -->
<input ... onclick="calc(this.form)">
5   名前： tosi ： 2006/10/21（土） 09:28  ID:7VBgPpxA
お二方、ご丁寧にありがとうございます！
これで私にも出来そうです。お世話になりました。
一覧へ戻る