1つのページにformを2つ設置。2つ目のformが動きません（泣）

質問

ショッピングサイトを制作しているWebデザイナーです。Java Scriptについて質問です。

私が制作しているWebサイトは、商品ページのformでインプットされたデータをサーバー上のASPに渡す仕組みとなっています。

以前は、色・サイズなどオプション項目を選択しなくてもデータが渡されてしまっていたため、validateFormを使ってオプションが選択されていない場合はエラーメッセージを表示するように修正しました。

ところがvalidateFormを付けた後、1ページに2つ以上formがあると、2つ目以降のformで（データが届かないという）ASPエラーが出るようになってしまいました。

----------------------------
以前（validateFormを付ける前）のform action部分

<form action="https://～/productProcess.asp" method="get" id="form1">

----------------------------
新しい（validateFormを付けた後）のform action部分

<form action="https://～/productProcess_new.asp" method="get" name="form1" onsubmit="return validateForm(this);">

----------------------------

これは、validateFormを付けたためデータが送られないようになってしまったのでしょうか？1ページに2つ、3つformを付けるにはどのように修正すればよろしいでしょうか？

分かる方、ご回答よろしくお願いします。

回答No.1

yambejp · ベストアンサー

validateFormの仕様がわからないのでなんとも
いえませんが、validateForm(this)をしたときに
falseを返してきているためだと推測されます。
おそらくオプションが選択状態がただしくないの
でしょう。
サブミットのチェッカーが汎用的にできているか
よくよく検証なさった方がよろしいかと思います。

今回の不具合とは無関係だとは思いますが
以前idで管理していたものをnameに換えたのは
なにか意味があるのでしょうか・・・。
当然idやnameが被らないように注意してください。

もちろん１ページに複数のフォームは問題なく
おけます。

お礼

現状使用している入力・選択チェックのJavaScriptの関係で、formのnameを被らせているとのことでした。なので、JavaScript自体を修正することにします。

yambejpさん、ありがとうございました。

補足

yambejpさん、お返事ありがとうございます。

「当然idやnameが被らないように注意してください」というコメントを受け、現状のサイトでformが2つある（そして動作している）ページのソースを見てみたら、1つのページ内にいくつformがあっても全てform nameが"form1"となっており、input nameも全て被っていました。そのため、同じようにname（id）を全て被らせたら、ちゃんと動作するようになりました。

きっと、ASPのinputデータ受け取り側にform nameを被らせてほしい理由があるのだと思います。プログラムを作った担当者になぜname（id）を被らせているのか聞いてみます。

（その結果は後でお知らせします）

回答No.2

noname#18558

JavaScriptというかHTMLの仕様の問題ですが、
ひとつのページにformが複数ある場合は、submitしたformの内容しかサーバーには送信されないはずです。