人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

JavaScript初心者の質問です。

現在フリーのCGIを使ってショッピングカートを作成しています。
そこで総重量を算出する必要があり、JavaScriptにて計算させようとしているのですが、
CGIの関係で
1個の重さ 注文数
┌─────┐ ┌─────┐
注文?│name="A" │ ---- │name="B" │
└─────┘ └─────┘
┌─────┐ ┌─────┐
注文?│name="A" │ ---- │name="B" │
└─────┘ └─────┘
注文? ・ ・
注文? ・ ・
注文? ・ ・
というように同一のname名で注文が並んでいきます。
それぞれの1個ずつの重さは変わります。

そこで、
注文?の A[0] * B[0] = W[0]
注文?の A[1] * B[1] = W[1]



A[i] * B[i] = W[i]

と考えてname="A" の配列と、name="B" の配列をそれぞれ乗じて、Wの配列総数値を合計するというイメージを考えました。
が、それがscriptとして書けません・・・(*ノ_<*)
私の力量からCGI側に手を加えること不可能なため、どなたか御教示をお願い致します。 <(_ _)>

●質問者: hidecky
●カテゴリ:ウェブ制作
✍キーワード:CGI JavaScript name SCRIPT イメージ
○ 状態 :終了
└ 回答数 : 3/3件

▽最新の回答へ

1 ● pahoo
●30ポイント

問題が2つあります。


1.同じ name の値を取り出すことはできません

同じ name="A" の text box が複数並んでいるとしたら、個別の値を取り出すことは出来ません。個別に取り出すのでしたら、下記のような HTML にしてください。

<input type="text" name="A[1]" />
<input type="text" name="A[2]" />
<input type="text" name="A[3]" />

<input type="text" name="B[1]" />
<input type="text" name="B[2]" />
<input type="text" name="B[3]" />

2.総重量計算はサーバ側で行いましょう

JavaScript(クライアント側)で計算した結果を「正」としてはいけません。ユーザー側で不正な計算を行い、その結果をサーバ側に戻される恐れがあるからです。

おそらく、送料算定のために総重量計算を行っているのだと想像しますが、お金に関わる計算は、かならずサーバ側で行ってください。

CGI変更は大変だと思いますが、変更可能なCGIを探すことをお勧めします。

◎質問者からの返答

pahooさん、回答有難う御座います^^

仰る通り、送料算定のための総重量計算です。

同一nameが並んでしまうのは、CGIがタグを吐き出してしまうからなのですが、

A[0]×B[0]をW[0]に・・・A[i]B[i]でW[i]にという3つの配列を定義するのは不可能なのでしょうか・・・

以下、拙いですが挑戦(?)したのですが

function kakunin() {

var ary1 = document.getElementsByName("omosa");

for( var i = 0 ; i < ary1.length ; i++ ) {

var sub1 = parseInt(ary1[i].value);

};

var ary2 = document.getElementsByName("kazu");

for( var i = 0 ; i < ary2.length ; i++ ) {

var sub2 = parseInt(ary2[i].value);

};

var subtotal = 0;

var ary3 = sub1[i] * sub2[i];

for( var i = 0 ; i < ary3.length ; i++ ) {

var sub3 = parseInt(ary3[i].value);

if( !isNaN(sub) ) subtotal += sub3;

};

var total = subtotal;

document.form1.field_total.value = total; // 合計を表示

}

<form action="" method="POST" name="form1">

<input type="text" name="omosa" value="200"><input type="text" name="kazu" value="1">

<input type="text" name="omosa" value="300"><input type="text" name="kazu" value="2">

<input type="button" onclick="kakunin()" value="Total Weight">

<input type="text" name="field_total" size="10" value="total">

</form>

やりたい事のイメージは伝わりますでしょうか・・・?^^;


2 ● Mook
●30ポイント

セキュリティの問題等は別にして、JavaScript ととしての実装例です。

<html>
<head>
<script type="text/javascript">
<!--
function calc() {
var as = document.getElementsByName( "A" );
var bs = document.getElementsByName( "B" );
var sum = 0;
for( var i=0 ; i<as.length && i<bs.length; i++ ) { 
if ( as.item(i).value.length > 0 && bs.item(i).value.length > 0 ) {
sum += as.item(i).value * bs.item(i).value;
}
}
document.myForm.sum.value = sum;
}
// -->
</script>
</head>
<body>
<form name="myForm">
1 <input type="text" name="A" onchange="calc();"><input type="text" name="B" onchange="calc();"><BR>
2 <input type="text" name="A" onchange="calc();"><input type="text" name="B" onchange="calc();"><BR>
3 <input type="text" name="A" onchange="calc();"><input type="text" name="B" onchange="calc();"><BR>
4 <input type="text" name="A" onchange="calc();"><input type="text" name="B" onchange="calc();"><BR>
5 <input type="text" name="A" onchange="calc();"><input type="text" name="B" onchange="calc();"><BR>
合計<input type="text" name="sum">
</form>
</body>
</html>
◎質問者からの返答

Mookさん、回答有難う御座います^^

時間差で自分のソースを書いてしまいました。。。

参考にして頑張ってみます。 <(_ _)>


3 ● Numeric
●50ポイント ベストアンサー
var omosa = document.form1["omosa"];
var kazu = document.form1["kazu"];
var total = 0;
if(omosa.length){
for(var i=0;i<omosa.length;i++){
total += omosa[i].value * kazu[i].value;
}
}else{
total = omosa.value * kazu.value;
}
document.form1["field_total"].value = total;

こんな感じかな?IE7でしか見てませんが…

商品数が1個のときにも対応してます。

◎質問者からの返答

Numericさん、回答有難う御座います^^

いきなり出来上がりそうなソースを有難う御座います^^

やってみますっ^^

| | | | | | ?゙(ノ><)ノ!

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ