• ベストアンサー

ダミーフォームの内容を送信用フォームに受け渡し&文字連結

JavaScriptは超初心者です。想像で喋っておりますので、専門用語等の間違いや見当違いな部分は見逃してください。 比較的安価ですが機能の優れたショッピングカートを使用しております。全てをカートCGIで済ませる他、オリジナルで用意したHTMLからFORMで指定されたCGIに送信することでカートに商品が入る方法も使用でき、現在その方法でショッピングサイトを構築中です。 HTMLでFORM送信する場合、商品名や価格など定められた値のほか、自由項目として5つまで自由にフィールドを増やして、その値をカートに送信することができます。今まではその5つの情報で十分間に合っていたのですが、今回追加を検討している商品の送信したい情報が5つを超えてしまい、その商品だけカートを使わないという方法を取るわけにもいかず、困っています。 ▽CGI機能範囲内の送信情報 商品名・価格・数量・option1~5 ↓ ▽でもこうしたい 商品名・価格・数量・option1~5+追加option6・option7 無理やりoption6・option7を送信しても、ショッピングカート上にはやはりVALUEは表示されませんでした。option1~5という名前で設定されたVALUEしか受け取らないようです。 本当に困り果てていたところ、JavaScriptを使用すればいいのでは?というご意見をいただき、質問させていただきました。 まだまだ長くなりますので、回答1に続きを書きます。

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

  • ベストアンサー
  • pipipi523
  • ベストアンサー率40% (148/365)
回答No.5

>ラジオボタンを使用 No.4さんのスクリプトを入れるとこんな感じだと思います(スクリプトの部分だけ) <!-- function func() { document.F1.opt3.value=getValue( "opt3" ) + "+" + document.F2.opt4.value; document.F1.submit(); } function getValue( name ) { value = ""; e = document.getElementsByName( name ); for( idx=0; idx<e.length; idx++ ) { if( e[ idx ].checked ) {value += e[ idx ].value;} } return( value ); } // -->

CHI-512
質問者

お礼

何度もすみません。書いていただいたスクリプトをはめ込み使用してみた所、きちんとVALUE値が送信できるようになりました。また、スクリプトとにらめっこし、ラジオボタン+ラジオボタンの場合や、ダミーフォームを使用せず、一つのフォーム内で済ませるやり方も何とか考え付くことができました。 pipipi523様のご回答がなければ解決することは出来なかったと思います。これでクライアントの要望に応える事が出来ます。本当にありがとうございました。

全文を見る
すると、全ての回答が全文表示されます。

その他の回答 (4)

  • asahina02
  • ベストアンサー率47% (95/202)
回答No.4

前段階の質問で回答させていただいた者です。 その質問ではラジオボタンになっていたので、一応その場合のスクリプトを・・ まぁ参考にしてみてください。 function set() { value = ""; value += getValue( "optionA" ); value += getValue( "optionB" ); document.send.CCC.value = value; } function getValue( name ) { value = ""; e = document.getElementsByName( name ); for( idx=0; idx<e.length; idx++ ) { if( e[ idx ].checked ) { value += e[ idx ].value; } } return( value ); }

CHI-512
質問者

お礼

先日は大変お世話になりました。こちらの質問にもお答えいただき、感激です。 書いていただいたスプリクトですが、pipipi523様のスクリプトと一緒に(合わせて?)使用することで、ラジオボタン使用時のVALUE値否取得の件も解消することができました。 ありがとうございました。本当に助かりました。

全文を見る
すると、全ての回答が全文表示されます。
  • pipipi523
  • ベストアンサー率40% (148/365)
回答No.3

こんな感じ? <html><body> <script type="text/javascript"> <!-- function func() { document.F1.opt3.value=document.F2.opt3.value + "+" + document.F2.opt4.value; document.F1.submit(); } // --> </script> </form> <form name="F1" action="cart.cgi"> 商品1<input type="hidden" name="sina" value="s1"><br> 価格:49,800円(税込)<input type="hidden" name="kakaku" value="4800"><br> 購入数:<input type="text" size="3" maxlength="3" name="CNT" value="1">個<br> option1<input type="text" size="3" maxlength="3" name="opt1" value="op1"><br> option2<input type="text" size="3" maxlength="3" name="opt2" value="op2"><br> <input type="hidden" name="opt3"> </form> <!--追加オプション用のフォーム--> <form name="F2" action="#"> option3<input type="text" size="3" maxlength="3" name="opt3" value="op3"><br> option4<input type="text" size="3" maxlength="3" name="opt4" value="op4"><br> <input type="button" value="カートへ" onclick="func()"> </body></html>

CHI-512
質問者

補足

ありがとうございます。早速試してみました。 追加オプションが、テキストエリアの場合も、SELECTの場合もきちんと送信できました! しかし、追加オプション用のフォームに <input type="radio" name="opt3" value="あ" checked="checked" /> <input type="radio" name="opt3" value="い" /> <input type="radio" name="opt3" value="う" /> <input type="radio" name="opt3" value="え" /> <input type="radio" name="opt3" value="お" /> とラジオボタンを使用すると、opt3のVALUEが『undefined』となってしまいます。原因が分かりますか?お手数をお掛けしますが、お答えいただければ幸いです。

全文を見る
すると、全ての回答が全文表示されます。
  • talepanda
  • ベストアンサー率58% (45/77)
回答No.2

JavaScriptで文字列連結も可能ですが、CGIを変更するのが一番らくだと思いますよ(ライセンス上可能なら、ですけど)。 どうしてもJavaScriptでやる場合は、 <form ... onsubmit="getElementById('option5').value+=','+getDocumentById('option6').value+','+getDocumentById('option7').value;true;"> とかすればいいんですけど(textboxの場合)、結局CGI側で連結したテキストを分割しないといけないんじゃないですか?

CHI-512
質問者

お礼

回答ありがとうございます。 >CGI変更 その通りなんですよね。それが一番簡単なんですが、配布元にも有償でいいからカスタマイズして下さい!と頼んでみたところ断られてしまったんです。

全文を見る
すると、全ての回答が全文表示されます。
回答No.1

質問者です。サブ用のIDで失礼します。続きを書きます。 商品オーダーページに、ID=Aのダミーフォームを用意、その中で、商品名・価格・数量・option1~5、追加option6・option7を客に入力・選択させます。 その内容を、同ページのID=Bの送信用本命フォームに受け渡す。ですが、option6・option7の内容は送信できませんので、ID=Bに受け渡す際、option5として3つのVALUEを連結させる。 option5のVALUE=option5とoption6・option7が続きで書かれたVALUE ID=BのSUBMITボタンを押した時に一連の作業が行われる??VALUEは重複しない。 ・・・・という感じですが、いかがでしょうか?JavaScriptは全く分かりませんので、はちゃめちゃな事を言っていたらすみません。出来れば、このスクリプトをコピーしろ!くらい詳細な回答がいただけると助かります。また、連結させたいフィールドが、テキストエリアの場合、チェックボックスの場合、ラジオボタンの場合など、違う記述が必要な場合も書いていただけると非常に助かります。 よろしくお願いします!!!!

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • 【続】ダミーフォームの内容を送信用フォームに受け渡し&文字連結

    先日、同じタイトルで質問したものです。以前した質問の内容は、以下でご確認下さい。 http://oshiete1.goo.ne.jp/kotaeru.php3?q=2387209 今度は違う問題が発生してしまいました。下記スクリプトを設定した購入ボタン(SUBMIT)を押し、ショッピングカートの画面(CGI)に入ると、きちんとJAVASCRIPTで指定した通りにVALUEの受け渡し・文字連結されていることが確認できました。 次に、カート画面の『前の画面に戻る』(onclickでhistory.go(-1)がシステムで設定されてあり変更不可)を押すと、当然商品オーダー画面に戻り、FORM内容もそのまま残っております。 そこで、もう一度同じ商品を同じ内容で購入、もしくは個数を変更・VALUEを変更などして購入しようとすると、購入個数がダブって送信されてしまいます。個数倍以外におかしい点はありませんでした。 1個購入すると → 2個、10個購入すると → 20個 IE7で確認。FIREFOXでは正常に送信されました。IEの何かバグでしょうか? この重複を防ぐような追記スクリプトがあれば教えてください。よろしくお願いします。 <script type="text/javascript"> <!-- function func() { document.SELECT.option2.value=getValue( "option2a" ) + "/" + getValue( "option2b" ); document.SELECT.option3.value=document.SELECT.option3a.value + "/" + document.SELECT.option3b.value; document.SELECT.submit(); } function getValue( name ) { value = ""; e = document.getElementsByName( name ); for( idx=0; idx<e.length; idx++ ) { if( e[ idx ].checked ) {value += e[ idx ].value;} } return( value ); } // --> </script>

  • 1つのフォームで2つの送信先と送信内容

    例えば、処理内容はほぼ一緒なのですが、営業1課2課それぞれが独自にWebページを持っていてフォームから送信された内容を処理するCGIも独自に作っています。 ●1課のWebフォーム <FORM ACTION=http://eigyo1.jp/nanka.cgi METOD=POST> カテゴリ:<SELECT name="category"> <OPTION value="衣類" selected>衣類</OPTION> <OPTION value="インテリア">インテリア</OPTION> </SELECT><BR> 商品検索:<INPUT TYPE=TEXT NAME=hinmei> </FORM> ●2課のWebフォーム <FORM ACTION=http://eigyo2.jp/Kanka.cgi METOD=POST> カテゴリ:<SELECT name="genre"> <OPTION value="食品" selected>食品</OPTION> <OPTION value="日用雑貨">日用雑貨</OPTION> </SELECT><BR> 商品検索:<INPUT TYPE=TEXT NAME=kensaku> </FORM> これを1つのフォームでリストボックスに食品、日用雑貨、衣類、インテリアとし、検索語も1つのテキストボックスとし、食品・日用雑貨を選択するとeigyo1の方へ検索語の名前はhinmei、衣類、インテリアを選択するとeigyo2の方へ検索語の名前はkensakuで送信できる様にするにはどうしたらよいのでしょう。多分Javascript使わないとだめだということだけは分かるのですが・・・

  • プルダウンの値から別の値を引張る?(FreeCGI:FreeCartを使用)

    初心者です(CGI・PHPを一人でプログラミングすることは出来ません。HTMLコーディングは出来る程度です。)。 オンラインショップの作成をしており、うまくいかなくなりご相談させていただきたいと思います。 FreeCart.jp(http://www.freecart.jp/cart8.html)のCGIを使っています。 使用例サンプル:http://www.freecart.jp/cart3.html <form Action="http://domain.com/cgi-bin/acart/setcook.cgi" METHOD=POST> <INPUT TYPE="hidden"NAME="shouhinmei" VALUE="商品名:あああ"> <INPUT TYPE="hidden" NAME="kakaku" VALUE="100"> <select name="shouhinnumber"> <option>候補をお選びください</option> <option value="aaa">商品名:あああ</option> <option value="bbb">商品名:いいい</option> <option value="ccc">商品名:ううう</option> <option value="ddd">商品名:えええ</option> </select> 数量<input name="kazu" type="text" size="4" /> <INPUT NAME="SUBMIT" TYPE="SUBMIT" VALUE="カートにいれる"> </FORM> このフォームまでは作成できました。 このままですと、name="shouhinnumber"(商品NO)は「aaa」や「bbb」と変更可能なのですが、NAME="shouhinmei"(商品名)は全て「あああ」となってしまいます。 やりたいことは、プルダウンメニューで選択し、商品NOの値を選択すれば、自動的に商品名の値も対応したものが選択でき、カート内に明記できることです。 商品価格はすべて同じです。 少々表現が分かりにくいかもしれませんが、ご教授いただければ幸いです。 よろしくお願いいたします。

    • ベストアンサー
    • PHP
  • 送信フォームが動きません・・・どこが違ってますか?

    ・http://www.ahref.org/cgi/formmailer/を使用しています。 ・メールアドレスは実際には自分のアドレスを設定しており、cgiのファイル名は、form.cgiです。 ・送信ボタンを押すと、確認画面がでず、メールも送信されず、画面がform.cgiのソースが表示された画面に切り替わってしまいます。 以上よろしくお願いします。 cgi初心者なので、不足な情報があるかと思いますので、 ぜひお知らせください。

    • 締切済み
    • CGI
  • フォームからのデータ送信方法

    どのカテゴリーに質問させていただいていいのか見当がつかなかったのでこちらに 投稿させてもらいました 見よう見まねでフォームからのデータ送信を試みています。 やり方に検討がつかずヒントをもらえたらと思います 最終目標はショッピングカートへのデータ送信です 一つの商品をカゴに入れるには下記のような形だというところまではわかりました <form action="/products/detail.php" method="post" name="a11" id="a11" > <input type="hidden" name="mode" value="cart" /> <input type="hidden" name="product_id" value="137" /> <input type="hidden" name="product_class_id" value="634" /> <input type="checkbox" name="quantity" value="1" /> <input type="submit" value="購入する" /> しかし、商品にはグループが3つあり、さらに各グループには9つの商品あります なので合計27個の商品の中から3つを選んでもらう形をとりたいのです どれを選んだのかがわかるように一覧の中から選択してもらいたいです Aグループ (商品1、商品2、商品3・・・・) Bグループ (商品10、商品11、商品12・・・・・) Cグループ (商品19、商品20、商品21・・・・・) という感じです 各グループの中からは一つしか購入できないので、 ラジオボタンで選択してもらい、それをフォームにてデータを送信 確認画面を経て、ショッピングカートへ送信という流れを取りたいと考えています ラジオボタンで選択後に商品の情報をカートに送るためにはどうすればよいでしょうか? 素人考えで、例えば、ボックスみたいのをつくり、その中に情報を記入、 それをなんらかの形で呼び出す みたいな感じでできる方法がないかと探しています お手数ではありますが、参照プログラムを記述していただけるとありがたいです 質問の仕方も下手で申し分けありませんが、足らない部分は随時追加させていただきますので、 必要な情報等もございましたらお教えいただければと思います どうぞよろしくお願いいたします

    • 締切済み
    • CSS
  • フォームよりCGIへ複数の値をPOSTしたい…。

    はじめまして。 現在、ショッピングカートのCGIを利用するためにHTMLを調整しています。 【単一商品の場合】 <FORM action="cgi-bin/cart/cart.cgi" method="POST"><INPUT type="hidden" name="shouhinnumber" value="0001"><INPUT type="hidden" name="shouhinmei" value="高級シャンプー"><INPUT type="hidden" name="kakaku" value="3000"> あとはセレクトフォームで数を選択して送信すれば正常に料金計算されるのですが、これが、内容量によって料金が異なる場合、どのようにHTMLを組めばよろしいのでしょうか。 ラジオボタンでそれぞれの行にINPUTを入れたが、先頭のINPUTしか認識せず、フォーム文を複数作るとマージンが空き、複数選択が可能になってしまう。 なお、CGIをいじるのは危険なので、HTML内でどうにかしたい・・・。 つまり・・・ 高級シャンプーの 260mlが1800円 500mlが3000円 というように単一商品名で代金が異なるものを1つのフォーム内でCGIへ送信できないでしょうか。 よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • selectでのフォーム送信

    下記の質問で別の解決手順を思いついたのですが技術力が不足しているのでどなたか助けてください。 フォームのselectが変更されたときに、そのフォームの内容をcgiファイルに送信するようなスクリプトがどこかにありませんか。具体的には、 <form name="form1" method="get" action="・・・.cgi"> <input type="text" name="text" size=20> <select name="sele" onChange()> <option・・・ <option・・・ </select> </form> といったフォームで、onChange()のなかでform1をsubmitしたのと同じ結果になるようにJavaScriptを書き込みたいのです。 どうかよろしくお願いします。

  • ラジオボタンでうまくするには・・・・

    初めまして。 現在下記のプルダウン形式で、一つの価格が同じなので問題なく動くのですが <FORM action="cart/sys/cart.cgi" method="post"> <INPUT type=hidden value=005 name=num> <INPUT type=hidden value=●●● name=name> <INPUT type=hidden value=2000 name=tan> <SELECT name=sur> <OPTION value="" selected>購入数量</OPTION> <OPTION value=1>1</OPTION> <OPTION value=2>2</OPTION> <OPTION value=3>3</OPTION> <OPTION value=4>4</OPTION> <OPTION value=5>5</SELECT> <INPUT type=submit value=カートに入れる> </FORM><BR> <FORM action="・・・/cart.cgi" method="post"> <INPUT type=hidden value=005 name=num> <INPUT type=hidden value=●●● name=name> <INPUT type=hidden value=2000 name=tan> </FORM> 同じ商品で1・2・3・4・5のそれぞれに単価が変わる設定をしたいのですが、うまくいく方法が見つからないです。 ラジオボタン形式で作ってみたものの・・・・ <FORM action="・・・/cart.cgi" method="post"> <INPUT type=hidden value=005 name=num> <INPUT type=hidden value=●●● name=name> <INPUT type=submit value=カートに入れる> </FORM> <FORM> <INPUT type="radio" name="name1" value="2000">1袋<BR> <INPUT type="radio" name="name1" value="3900">2袋<BR> <INPUT type="radio" name="name1" value="5800">3袋<BR> <INPUT type="radio" name="name1" value="7500">4袋<BR> <INPUT type="radio" name="name1" value="8500">5袋</FORM> としてみましたがうまくいきません。 なにか方法ございましたら、ご教授いただければと思います。

    • ベストアンサー
    • HTML
  • フォーム画面の文字を質問内容のように表示したい。

    javascriptでフォントサイズが変更できるようにしたフォームに文字を入力し、そのフォーム画面を残したままその文字を変更したフォントサイズで表示したいのですが、 (1)確認ボタンを押すとフォーム画面が消えるのを消えないようにしたい。 (2)表示する文字のフォントサイズの変更の仕方がわからない。 以上の2点の解決方法をご教示下さい? 宜しくお願いいたします。 <HTML> <HEAD> <STYLE type="text/css"> <!-- INPUT {font-size: 12px;} --> </STYLE> <SCRIPT language="JavaScript"> <!-- // フォームの文字の大きさを変更 function sizeTxt(n){ document.nForm.textN.style.fontSize = n.options[n.selectedIndex].value + "px"; } function check(){ var strName; strName = document.nForm.textN.value; document.write(strName); } //--> </SCRIPT> </HEAD> <BODY> フォントサイズを選択できます。 <FORM name="nForm"> <SELECT onChange="sizeTxt(this)"> <OPTION value="8">8px</OPTION> <OPTION value="10">10px</OPTION> <OPTION value="12" selected>12px</OPTION> <OPTION value="16">16px</OPTION> <OPTION value="20">20px</OPTION> <OPTION value="24">24px</OPTION> <OPTION value="30">30px</OPTION> </SELECT><BR><BR> <INPUT type="text" size="45" name="textN"><BR> <input type="button" value=" 確認 " onClick="check()"> </FORM> <SCRIPT language="JavaScript"> </SCRIPT> </BODY> </HTML>

  • 携帯にメール送信フォーム

    下記のサイトのように携帯にメール送信フォームを作成しました。 http://www.mti.co.jp/decopc/decotomo.html aspというのがわからなく、javascriptで下記の記述をしたのですが、 送信ボタンを押すとブラウザがフリーズしてしましました。 これはどのようなことが原因で起きているのでしょうか? <script type="text/javascript"> <!-- function bayani(){ location.href = 'mailto:' +document.manalo.address.value+ '@' +document.manalo.chooses.value+ '?subject=サイト名&amp;body=サイトURL?i=BAYANI'; } //--> </script> <form name="manalo"> <input type="text" size="30" name="address" value="" maxlength="50"> <select name="chooses"> <option value="docomo.ne.jp" selected>docomo.ne.jp</option> <option value="ezweb.ne.jp">ezweb.ne.jp</option> <option value="softbank.ne.jp">softbank.ne.jp</option> <option value="d.vodafone.ne.jp">d.vodafone.ne.jp</option> <option value="h.vodafone.ne.jp">h.vodafone.ne.jp</option> <option value="t.vodafone.ne.jp">t.vodafone.ne.jp</option> <option value="c.vodafone.ne.jp">c.vodafone.ne.jp</option> <option value="k.vodafone.ne.jp">k.vodafone.ne.jp</option> <option value="r.vodafone.ne.jp">r.vodafone.ne.jp</option> <option value="n.vodafone.ne.jp">n.vodafone.ne.jp</option> <option value="s.vodafone.ne.jp">s.vodafone.ne.jp</option> <option value="q.vodafone.ne.jp">q.vodafone.ne.jp</option> </select> <input type="button" onclick="bayani()" value="携帯にURLを送信"> </form>