• 締切済み
  • 困ってます

JavaScript ラジオボタン データを別ページに渡す

こんにちは、初投稿させていただきました プログラミングは始めて半年程度の未熟者です。 CGI・PerlとCを中心に独学でやってきましたが ホームページの製作をしてみようと思い、 ついこの前からJavaScriptにも挑戦してみています。 その中で「チェックされたラジオボタンの情報を別ページに渡す」 ということをやってみたいのですが、なかなか上手く行きません。 調べてみたところ、 結構同じような質問はあるのですが… どれもちょっとやりたいことと外れてました。 ・やりたいこと-------------------------------- Aページ ・ラジオボタンチェック ↓ 次のページにAでチェックしたボタンの情報を渡す Bページ ・ラジオボタンチェック       (渡って来た情報は表示せず保持したまま) ↓ 次のページにA,Bでチェックしたボタンの情報を渡す Cページ ・ラジオボタンチェック       (渡って来た情報は表示せず保持したまま) ↓ 次のページにA,B,Cでチェックしたボタンの情報を渡す ・ ・ ・ と、いう風に 連続して情報を次へ次へと渡していければなぁ と思います。 どこかのサイトの「~診断」と同じような感じです。 ただ、「ブラウザがあれば実行可能」というものを作りたいのです。 (インターネットに繋がなくても使用可能) ------------------------------------------------------- ・わからないこと ラジオボタンをチェック状態を取得して 次ページに移った時の「読み込みと処理の仕方」が分からないです… 渡って来た情報をどんな風な形にまとめて保持したまま 次ページに渡すのか@@ 書き方がイマイチ分かりません…それとも無理なんだろうか… 「分からないことやるなよ…」と思われるかもしれませんが 何卒ヒントだけでも教えて貰えないでしょうか。

共感・応援の気持ちを伝えよう!

  • 回答数5
  • 閲覧数1458
  • ありがとう数2

みんなの回答

  • 回答No.5
noname#84373
noname#84373

>何卒ヒントだけでも教えて貰えないでしょうか。 っていうからヒントだけに^^; 共通スクリプト //クッキーを読み込む function getCookie( valueName ){ var value = '', c, cookies = document.cookie.split('; '); for(var i in cookies) if((c = cookies[i].split(/=/), c[0]==valueName)) return c[1]? unescape( c[1] ): ''; return false; } //クッキーの保存 function putCookie( valueName, value, day ){ document.cookie = valueName + '=' + escape( value )+ '; expires=' + new Date( (new Date).getTime() + day * 86400000).toGMTString(); } //イベントの追加 function addEvent(elementId, evt, eventHandler, flag){ var element = ( typeof( elementId ) == "string" )? document.getElementById( elementId ): elementId; element./*@cc_on @if(1)attachEvent('on'+ @else @*/addEventListener(/*@end@*/evt, eventHandler, flag); } //フォームのエレメントに値をセット function setFormValue( element, val ){ var obj = ( typeof( element ) == "string" )? document.getElementById( element ): element; if(!obj)return false; var objs = ( obj.id == element )? [obj]: document.getElementsByName( element ); for( var i = 0, mx = objs.length; i<mx; i++ ){ var obj = objs[i]; switch( objs[i].type ){ case 'text': case 'textarea': case 'button': case 'reset': case 'submit': case 'hidden': objs[i].value = val; break; case 'checkbox': objs[i].checked = !!val; break; case 'radio': objs[i].checked = (objs[i].value == val); break; case 'select-one': for( var j=0, mx2=objs[i].options.length; j<mx2; j++) objs[i].options[j].selected = (objs[i].options[j].value == val); break; } } } ---------------------- test.html <html> <body> <form> <p> ラーメンなら <input type="radio" name="ra-men" value="sio">塩 <input type="radio" name="ra-men" value="miso">味噌 <input type="radio" name="ra-men" value="tonkotu">とんこつ <input type="button" value="次へ" id="t1"> </p> </form> setFormValue( 'ra-men', getCookie('ra-men')); addEvent( document.body, 'click', chkClick ); function chkClick(e){ var obj = e.target || e.srcElement; if(obj.type && obj.type == 'radio') putCookie( obj.name, obj.value, 1); if( obj.id=='t1' ) location.href = 'test1.html'; } </script> -------------------------- test1.html <html> <body> <form> <p> ラーメンの具なら <input type="radio" name="gu" value="niku">チャーシュー <input type="radio" name="gu" value="kohn">コーン <input type="radio" name="gu" value="bata">バター<br> <input type="button" value="次へ" id="t2"> </p> </form> <script> setFormValue( 'gu', getCookie('gu')); addEvent( document.body, 'click', chkClick ); function chkClick(e){ var obj = e.target || e.srcElement; if(obj.type && obj.type == 'radio') putCookie( obj.name, obj.value, 1); if( obj.id=='t2' ) location.href = 'test2.html'; } </script> --------------- test2.html <html> <body> <form> <p> ラーメンなら <input type="radio" name="ra-men" value="sio">塩 <input type="radio" name="ra-men" value="miso">味噌 <input type="radio" name="ra-men" value="tonkotu">とんこつ </p> <p> ラーメンの具なら <input type="radio" name="gu" value="niku">チャーシュー <input type="radio" name="gu" value="kohn">コーン <input type="radio" name="gu" value="bata">バター<br> </p> </form> <script> setFormValue( 'gu', getCookie('gu')); setFormValue( 'ra-men', getCookie('ra-men')); addEvent( document.body, 'click', chkClick ); function chkClick(e){ var obj = e.target || e.srcElement; if(obj.type && obj.type == 'radio') putCookie( obj.name, obj.value, 1); } </script>

共感・感謝の気持ちを伝えよう!

関連するQ&A

  • ラジオボタンでチェックした情報

    ラジオボタンでチェックした情報を次のページに反映したいです。方法を教えてください

    • ベストアンサー
    • PHP
  • ラジオボタンのチェック

    VB2010で作成してるんですけど。 ラジオボタンをフォームに入れてデバッグすると、ラジオボタンがチェックされて表示されてしまいます。。 Form_Loadでラジオボタンのチェックを外すコードは書いたんですけど・・。 RadioButton1.Checked = False という風に。 でもやはりチェックがついています。。 どうしたらチェックを外した状態で表示できるでしょうか?

  • Javascriptを使って動的にラジオボタンを配置する方法

    こんにちは。 Javascriptを模索しながら仕事で作業しています。 (突然、要員として投入されてしまいました <(ToT)> ) タイトルにあるように、ラジオボタンをJavascript を使って、ラジオボタンの配置数を動的に変化させ たいのですが、ネットを検索しても、ラジオボタン の配置数を動的にしているサイトがないので、難航 中す。「ラジオボタンの配置数を固定として…」が ほとんどでした。 画面を表示するときに、JavaBeanでラジオボタンの 情報を獲得できるので、この情報に従い表示したい です。表示中に、ラジオボタンの配置を変更するこ とはなく、submitにより、入力内容のチェックを行っ た後、サーブレットを起動する流れになっています。 すみませんが、手助けお願いします。

  • 回答No.4
  • fujillin
  • ベストアンサー率61% (1594/2576)

1)サーバ経由でよければ、通常のPOST(またはGET)で次のページへ渡す。 2)クライアント側だけで処理するなら  同様に location.search を利用して可能ですが、これだと受け渡しが見えてしまいますね。  この場合はクッキーを利用するのが良いかも。 (ユーザが拒否しているとダメだけど・・・って、スクリプトそのものも拒否されてたら、そもそも成り立たないけど)

共感・感謝の気持ちを伝えよう!

  • 回答No.3

Cookie使うとか。

参考URL:
http://www.tohoho-web.com/wwwcook.htm

共感・感謝の気持ちを伝えよう!

  • 回答No.2
  • Yanch
  • ベストアンサー率50% (114/225)

FRAMEを活用すれば出来るんじゃないですか?

共感・感謝の気持ちを伝えよう!

  • 回答No.1
  • redfox63
  • ベストアンサー率71% (1325/1856)

どちら側の処理でデータを受けるのでしょう? サーバ側/クライアント側 チェックボックスなどをFORMのメンバーにして ページの遷移にはFORMのSubmit(送信)を使うとするなら サーバー側であれば Request.FormやRequest.QueryStringなどから情報が拾えます クライアント側ですとFORMをGETで送信するようにして document.locationからデータを抽出しましょう

共感・感謝の気持ちを伝えよう!

関連するQ&A

  • asp上でのラジオボタンについて

    aspのプログラムでラジオボタンを設置し、「検索」というボタンをクリックすることで、ラジオボタンに対応する一覧データを表示するというプログラムを作っています。 ラジオボタンを「パターン1」、「パターン2」という2つを作り、どちらかチェック出来るようにしたのですが、検索ボタンをクリックすると、パターン1、パターン2のどちらをチェックしていても、パターン1にチェックされている状態になってしまいます。 一応、初期表示状態として、パターン1にチェックされた状態になっているのですが、パターン2をチェックしていてもパターン1に戻ってしまいます。 検索後も、チェックしたラジオボタンのまま表示させる方法として何かいいやり方があれば、教えてください。

  • ラジオボタンを押すと、表示が切り替わるようにしたい

    現在phpとmysqlでショッピングサイトを作っています。 理想としてはラジオボタンのチェックを切り替えると、送信ボタン等を押さなくても、ラジオボタンより以下の商品の表示が切り替わるようにしたいです。 それぞれのチェックにSQLの条件を変えて、条件によって商品の表示を変えるようにしたいのですが、難しいでしょうか? 送信ボタンを押さなくてもする場合はjavascrpitでしょうか?

    • 締切済み
    • PHP
  • ラジオボタンとcsvファイル

    C#言語で数字が割り当てられているラジオボタンをチェックして、割り当てられた数字をcsvに書き込む方法をどのようにプログラムに書いたらいいか分からないで困っています。 例えば、1~5の数字を割り当てられたラジオボタンが5個あります。 もし、2のボタンをチェックして、次へを押すとcsvに2を書き込みます。 さらに、今度は3のボタンをチェックすると次の行に3を書き込みます。 上記のような動きを作ろうとしていますが、どのように書いたらよいか分からないでいます。 サンプルを書いていただけると助かります。 よろしくお願いします。

  • ラジオボタンについて。

    データの更新を行なう画面をつくり、データベースから取得したデータをもとにテキストの内容やラジオボタンのチェックの有無を画面に表示させようとしています。 最初に更新画面を呼び出し、データを表示することはうまくいくました。 しかし、IEの[表示]-[エンコード]や[最新の状態に更新]をやったり、戻るボタンで戻ると、テキストの内容は表示されるのですが、ラジオボタンは、なぜか一瞬チェックした後に、すぐチェックが外れてしまいます。 今やっているのは、Webの画面全てをASPで表示した後で、 最後にJavaScriptにより、 <script language='javaScript'> ラジオボタン名(i).checked = true; </script> のようにやっているのですが。。。 このやり方がまずいのでしょうか? 最初にボタン設定する際に"<INPUT TYPE ='radio' ~ checked>"で指定しなければいけないのでしょうか? よろしくお願いします。

  • aspのラジオボタン

    こんばんわ。 aspでチェックの入っているラジオボタンを150個表示したのですが、「全て解除」ボタンを押すと150のチェックを外したいのです。 どのように記述したらよいのでしょうか? 調べてはいるのですが、四苦八苦でなかなか進みません。 よろしくお願い致します。

  • [html] リンク先のページのラジオボタンを選択済みにしたい

    「a.html」のリンク <a href="b.html">選択肢1</a> を踏んだ際に、次のページ「b.html」の対応した選択肢(ラジオボタン)をチェック済みにしたいのですが、どのようにしたらよいのでしょうか。 b.html <input type="radio" />選択肢1 <input type="radio" />選択肢2

    • ベストアンサー
    • CSS
  • Ajaxでラジオボタン

    いつもお世話になっています。 現在製作したいものがあるのですが知識不足故に形にできず困っていますx_x; 会員式のサイトで各ユーザーIDが「$mid」という形で読み込んでいます。 ここでユーザーがラジオボタンで「表示」を押すと「$mid.cgi」というファイルに「1」という数字を書き込み、「非表示」を選択すると「0」という数字をAjaxを用いて書き込みたいと思っています。 <FORM>などを用いるとページ遷移が出てきてしまうので・・・。 また2回目以降そのページを表示すると、以前選択した方にずっとチェックが入り続けているようにするのはどのようにすればいいのでしょうか? お手数お掛け致しますがよろしくお願い致します。

  • ラジオボタンを使った簡単なアンケート(javascript希望)

    WEB上でアンケートを行い、その結果で飛び先が変わるページを作りたいと思います。 CGIではなくJavascriptで動かしたいのですが、あまり詳しくありません。原理を教えてもらってもちょっと。。なので、サンプルソースが欲しいのですがどうもみつかりません。 どなたか教えて欲しいです。お願いします! ■作りたいものの概要 アンケートは設問は二問。それぞれYorNの二択で、ラジオボタンで選択させます。 選択後、[結果]ボタンを押すと結果に応じたページが表示されます。 また、結果のパターンはYY,YN,NY,NNの四つのみで、YNとNYは別物と考えます。 ※ラジオボタンはデフォルトでYが選択されている。 ■その例; 設問1:あなたは●●ですか? はい いいえ 設問2:あなたは▼▼ですか? はい いいえ [結果] --------------- それぞれの結果ごとの飛び先をA.html, B.html, C.html, D.htmlとします。

  • JavaScriptについて

    JavaScriptについて JavaScriptで、ITパスポートの試験問題ページみたいなものが作りたいですが、記述の仕方がわかりません。 問題形式は、問1・問2・問3・・・と続き、解答は、すべてアイウエのどれかで、ラジオボタンで選んでいって、一番下の解答ボタンをクリックしたら、アラートが出てきて、次のような表示の仕方になるように作りたいです。 「正解数は○○問です。改行 合格/不合格です。」 なお、○○は、点数で、これは、各問の正解したものを合計していって、合格/不合格は、正解数が、正解数/総問題数が、60%を超えていたら、合格。そうでなければ、不合格と表示するものです。 そして、リセットボタンをクリックしたら、すべてのラジオボタンのチェックをはずすようにしたいです。そして、ラジオボタンは、各問1つに対して、1つのみ選べれるようにしてほしいです。 そして、不合格なら、アラートをもうひとつ表示したいです。内容は、「もう一度挑戦しますか?改行 挑戦するなら、OKをクリックしてください。」 そしてOKをクリックしたら、リセットし、キャンセルしたら、チャックデータはそのままにしておく。 上記のようなことは、可能なのでしょうか? 可能なら、お早めにご解答ください。 不可能なら、何がダメなのか教えてください。お願いします。

  • 複数あるラジオボタンをすべてチェックするには

    ページ内にラジオボタンを複数チェックしないといけないのですが、今のところuwscで試して1つしか選択できません。 問題は複数あるボタンの名称が同じなので、一つしか認識できないようです。 要素から選ぶのか、強制的に1行下がってチェックするのか、方法は一つではないかと思います。 uwscにはこだわっておらず、VBAや他のソフトでもよいので、ヒントになる情報をいただけると助かります。