• ベストアンサー

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を付けるにはどのように修正すればよろしいでしょうか？ 分かる方、ご回答よろしくお願いします。

質問者が選んだベストアンサー

  • ベストアンサー
  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.1

validateFormの仕様がわからないのでなんとも いえませんが、validateForm(this)をしたときに falseを返してきているためだと推測されます。 おそらくオプションが選択状態がただしくないの でしょう。 サブミットのチェッカーが汎用的にできているか よくよく検証なさった方がよろしいかと思います。 今回の不具合とは無関係だとは思いますが 以前idで管理していたものをnameに換えたのは なにか意味があるのでしょうか・・・。 当然idやnameが被らないように注意してください。 もちろん１ページに複数のフォームは問題なく おけます。

ovalearth
質問者

お礼

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

ovalearth
質問者

補足

yambejpさん、お返事ありがとうございます。 「当然idやnameが被らないように注意してください」というコメントを受け、現状のサイトでformが2つある（そして動作している）ページのソースを見てみたら、1つのページ内にいくつformがあっても全てform nameが"form1"となっており、input nameも全て被っていました。そのため、同じようにname（id）を全て被らせたら、ちゃんと動作するようになりました。 きっと、ASPのinputデータ受け取り側にform nameを被らせてほしい理由があるのだと思います。プログラムを作った担当者になぜname（id）を被らせているのか聞いてみます。 （その結果は後でお知らせします）

その他の回答 (1)

noname#18558
noname#18558
回答No.2

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

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • [HTML]FormのGETとPOSTについて

    Formタグで下記の場合（GET）は次ページへ遷移しますが <FORM name="form1" action="xxxxx.html" method="GET"> 下記の場合（POST）だと <FORM name="form1" action="xxxxx.html" method="POST"> 「ページを表示できません」のエラー（HTTP 405 - 許可されていないリソースです。） になってしまいます。 当方、環境はIIS5.1です。 この現象ご存知の方がいましたら、ご支援願います。 以上、宜しくお願い致します。

  • <FORM> </FORM> の中に　さらに <FORM> </FORM>があるときのSUBMITボタンについて

    今、 <FORM ACTION="aaa.asp" METHOD="POST" Name="form1"> <input type="SUBMIT" value="ボタン１"> <FORM ACTION="bbb.asp" METHOD="POST" Name="form2"> <input type="SUBMIT" value="ボタン2"> </FORM> </FORM> としていて、ボタン２を押すとbbb.aspに 飛んでほしいのでに、aaa.aspに飛んでしまいます。 こういう場合どのようにすればよいのでしょうか？ それぞれのボタンは hidden の値をそれぞれの フォームの中の値を渡したいので どうしてもSubmitがいいのです。

    • ベストアンサー
    • HTML
  • FormのonsubmitでJavaスクリプトを複数使えますか

    こんにちは。 いまフォームページで送信前に記入漏れがないかチェックするのに、スクリプトを使っています。 <form action="../cgi-bin/form.cgi" method="post" name="bkform" onSubmit="return Check()"> このほかに、スパム防止のためJcapというスクリプト（画像で出てくる文字を入力させる）を使うことにしました。 画面上に表示はできるようになったのですが、こちらのスクリプトも <form method="post" action="/cgi-bin/form.cgi" onSubmit="return jcap();" name="xfrm"> というようにonsubmitが必要です。 この二つのスクリプトを１つのページで動かすことは可能なのでしょうか？ ご教授お願いいたします・・・。

  • <FORM 　action="./" ついて

    <FORM action="./" method="GET" >で action="./" のスラシュを使用したときの機能について 教えてください。

  • formとactionとmethodについて

    初心者的な質問で申し訳ないのですが、 formを複数作りたい場合、メソッドをpost/get別々に指定したり、actionを別々のリンクを指定とかって出来たりするんでしょうか。 <form action="next.php" method="post">inputとか</form> <form action="prev.tpl" method="get">hiddenとか</form> 見たいな感じで、それぞれが別々、若しくは <form action="next.php" method="post">inputとか</form> <from action="next.php" method="get">inputとか</form> 見たいな感じで、リンク先は一緒だけどメソッドは違う等の指定方法を教えていただければと思います。 もし、指定出来ることは出来るが、javascriptで制御しなけらばならない等あるのでしたら、 その記述例等も一緒に教えて頂けると嬉しいです。 よろしくお願いします。

    • ベストアンサー
    • PHP
  • FORM ACTIONでBCCを使いたいのですが・・・

    Form Action でBCCが正しく使えるようにするにはどうしたらいいのでしょうか？教えてください。 宜しくお願いします。 現状は以下です。　bccだけが届きません。 <form action="mailto:aaaaa@***.co.jp?bcc=bbbbbb@*******.co.jp" METHOD="post" name="mail" onSubmit="return former()">

  • formのmethod=getの最大受け渡し数について

    いつもお世話になっております。 例えば、 <form action="xxx.asp" method="get"> </form> として送ったときに、渡される側ではURLに xxx.asp?a=1&b=1・・・・ となる訳ですが渡せる変数に限界はあるのでしょうか？ また、限界はなくても不都合なことはありますか？ 宜しくお願いします。

  • form 内 onChange

    恐れいります。 <form>内で、もう一つ<form>を作成し、送信したいのですが、 なかなかうまくいきません。form内のformは、selectボックスで、選択時に自ページにsubmitさせるようにしたいのですが。。 <form action="./xxx.cgi" method="POST"> <input type="text" name="xxx"> <form action="./" method="POST"> <select name="YYY" onChange="this.form.submit()"> <option value="ddd">ddd <option value="eee">eee </select></form> <input type="text" name="xxx"> <input type="submit" value="送信"> </form> よろしくお願いします。

    • ベストアンサー
    • HTML
  • 1つのformに複数のaction

    質問です。 下のようにiframeが２つあり、一つのformによる結果をそれぞれに反映させる検索ページ（kensaku.php）があります。 <script> function sample(F) { F.action = 'ichiran_map.php' F.target = 'ichiran_map' F.submit(); setTimeout(function(){ F.action = 'ichiran.php' F.target = 'ichiran' F.submit(); },1); return false; } </script> <iframe src="A.php" name="A" > <iframe src="B.php" name="B" > <form method="post" onsubmit="return sample(this)"> <select name="area"><option selected value="">エリア選択 </option> <option value="01">あいうえお</option> <option value="02">かきくけお</option> </select> <select name="price"> <option selected value="">価格帯選択</option> <option value="01">1000円未満</option> <option value="02">1001円～2000円</option> <input type=submit value="絞込" /></form> 別のページ（例えばindex.php）に同じようなformを作り、検索結果をこの検索ページに反映させたいと思います。この場合、一つのformに3つのactionを設定したいのですが、どうすれば実現できるでしょうか？ 表示画面はkensaku.phpにしたいのですが、そのkensaku.phpにある２つのiframe（A.phpとB.php）にformで指定した値を反映させたいのですが、どうすれば実現できるのでしょうか？どなかた教えて下さい。

  • ページ内の幾つかのformを1つの送信で送りたい

    初心者です。現在お店のホームページを作っているのですが、問合せのページでなかなかうまくいきません。すみませんがお知恵をお貸しください。 まず概要からいいますと、 商品上、複数の商品を一度に注文頂く事が多く、それを１ページにまとめたいと思っています。、 フォームは各商品を選べば、それに対応する項目が表示されます。 これを3つほどページ内に、同じ内容のものを設置し、1つの送信ボタンで送れないかと考えています。 そこで <script language="JavaScript" type="text/JavaScript"> <!-- function productA(sel) { var target = sel.value; var group = sel.form.getElementsByTagName("FIELDSET"); var i=0, fs; while(fs=group[i++]) fs.style.display = fs.id == target?"block":"none"; } function productB(sel) { var target = sel.value; var group = sel.form.getElementsByTagName("FIELDSET"); var i=0, fs; while(fs=group[i++]) fs.style.display = fs.id == target?"block":"none"; } //--> </script> として <boby> <form name="form1" method="post" action="cgi-bin/formmail.cgi"> 商品選択１<br> <select name="select1" onChange="productA(this)"> <option value="--" selected class="style9"> </option> <option value="A">A</option> <option value="B">B</option> </select> <fieldset id="A"> ■Ａの質問： <select name="q1A" size="1"> <option value="--" selected class="style9"> </option> <option value="q1A_1" >q1_1</option> <option value="q1A_2" >q1_2</option> </select> </form> <form name="form1" method="post" action="cgi-bin/formmail.cgi"> 商品選択2<br> <select name="select1" onChange="productB(this)"> <option value="--" selected class="style9"> </option> <option value="A">A</option> <option value="B">B</option> </select> <fieldset id="B"> ■Bの質問： <select name="q1B" size="1"> <option value="--" selected class="style9"> </option> <option value="q1B_1" >q1B_1</option> <option value="q1B_2" >q1B_2</option> </select> </form> <INPUT TYPE="submit" VALUE="送　　信"> という状況です。 <form>を分けている理由は1つのformにしてしまうと、商品選択1を記載し、 次の商品選択２がある場合、そこで別の商品を選択すると、先ほど記載した、 商品選択１がリセットされ、項目も別の商品の内容になってしまいます。 その為、formを分けている状態です。この状態では勝手にリセットはされませんが、 ただし、送信できません・・・ なので、この状態で送信できる方法はありませんか？ もしくはformを１つにしてもいいので、その際各formで商品選択をしても、 リセットされない方法があれば教えてください。 本当に初心者なので、出来ない事をいっているのかもしれません。 大変お恥ずかしいご質問ですが、何卒ご教授頂ければ助かります。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する