javascriptでフォームに値を渡す

前へ 次へ
このQ&Aのポイント
  • javascriptを使用してフォームに値を渡す方法を解説します。
  • ラジオボタンを使用して単一の値を渡す方法と、ボタンを押して複数の値を直接渡す方法を比較します。
  • 具体的な例として、URLを使用して値を渡す方法も紹介します。
回答を見る
  • ベストアンサー

javascriptでフォームに値を渡す

javascriptでサブウィンドウを開き、親ページにあるフォームの値をサブウィンドウのテキストフィールドに渡す方法で複数項目がある場合、下記URLのようにラジオボタンならうまくいったのですが ラジオボタンなしで、ボタンを押すと直接その値をサブウィンドウに渡す方法はないでしょうか？ 複数項目ある値をサブウィンドウに渡す（ラジオボタン) http://ausdruck.flier.jp/test/window11/oya_11.html 上記URLの方法ならうまくいったのですが下記URLのようにボタンを押してその値を 直接サブウィンドウに渡したいとおもっています。 http://ausdruck.flier.jp/test/window3/oya.html ▲こちらのイメージで渡したいのですが、複数項目があるとうまくいきません。

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

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

#2です。 ＞親の関数getData()を呼び出すにはどういう方法がありますでしょうか？ ご質問のサンプルでご提示の方法と同じです。 　alert( window.opener.getData() ); とか。 考えてみたら、値を渡さなくても要素を返しちゃった方が便利かも… ということで、親側が var Data = { 　node : null, 　get : function(){ return this.node }, 　set : function(evt){ 　　var t = evt.target || evt.srcElement; 　　if(t.nodeName != "INPUT") return; 　　this.node = t; 　　window.open("hoge.html",""); 　} }; （↑少し記述法を変えてます。変数が少なくて済むかと…） 子側が 　alert( window.opener.Data.get().value ); みたいなのでも良いのかも知れません。 （実際の使い方がわからないのでよくわかりませんが）

pc_web
質問者

お礼

できました！！ こんなにシンプルで安定感のある方法があったんですね！感動です、ほんとにありがとうございました。感謝です！

その他の回答 (2)

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

http://okwave.jp/qa/q7041449.html のほうが締め切られちゃったので、もうよろしいのかと思ったのですが… 単純にinuputのvalue値を渡せればよいと解釈して、以下で可能かと思います。 （前回、回答の3）の方法になっています。） 開いたhoge.html側から親の関数getData()を呼び出すことで値を取得可能です。 （変数dataにvalue値を覚えておいて、呼び出されたらそれを返しているだけ） （全角空白は半角に） <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head><title>sample</title> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <script type="text/javascript"> <!-- var getData; var setData = (function(){ 　var data = ""; 　getData = function(){ return data; }; 　return function(evt){ 　　var t = evt.target || evt.srcElement; 　　if(t.nodeName != "INPUT") return; 　　data = t.value; 　　window.open("hoge.html",""); 　}; })(); //--> </script> </head> <body> <div onclick="setData(event)"> <input type="button" value="value1"> <input type="button" value="value2"> <input type="button" value="value3"> <input type="button" value="value4"> <input type="button" value="value5"> </div> </body> </html> ＊ちなみにNo1様の回答は、前回回答の2）の考え方とほぼ同じです。 （要は、渡す値を一時記憶しておく場所をどこに設定するかの違い。）

pc_web
質問者

お礼

ありがとうございます、hoge.html側から親の関数getData()を呼び出すにはどういう方法がありますでしょうか？基本がなさすぎるためかそれでも理解できません、サンプルなどあれば助かります。

  • yamada_g
  • ベストアンサー率68% (258/374)
回答No.1

たとえば、oya.htmlにsub.htmlで値を取得するための項目（hidden）を用意して　 押されたボタンに応じてdispw実行時に値を設定するようにすればいいのではないでしょうか。

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

関連するQ&A

  • javascriptで開いたウィンドウに値を渡す

    JavaScriptのwindow.openで開いたページに値を渡したいのですが 複数項目ある場合はどうすればいいでしょうか？ ▼下記のようなページです。 http://ausdruck.flier.jp/test/window3/oya.html open1ボタンを押すとサブウィンドウのテキストフィールドにその値が入ります。 ひとつだけならできたのですがopen2,open3,open4,open5というふうにそれぞれ違う値を サブウィンドウに渡す事ができません、if文などを使えばよろしいでしょうか？ どんな方法でもいいのでご存知の方ご教授お願い致します。

  • javascriptで開いたウィンドウに値を渡す

    javascriptでボタンを押した時に別ページのウィンドウが開き、その開いたページのテキストフィールドに 任意の値を渡したいのですがうまくいきません。 逆に、新しいウィンドウを開いてそのページから親ウィンドウに値を渡す事はできました。 http://ausdruck.flier.jp/test/window/oya.html これの反対バージョンはつくれないでしょうか？御存知の方ご教授お願いします。

  • window.open親から子ウィンドウ内の値

    下記アドレスのように開いたウインドウから親ウィンドウの値を操作する事はできるのですが、これの反対バージョンはできないでしょうか？ http://ausdruck.flier.jp/test/window/oya.html ウィンドウをオープンボタンを押した時点で開いた子ウィンドウ内に値を渡す方法です。 いろんな方法を試してみたのですがなかなかうまくいかず困っています、どなたか御存知の方がいましたら御教授お願いします。

  • ＪＡＶＡＳＣＲＩＰＴで送信フォームを作っています

    ＪＡＶＡＳＣＲＩＰＴで送信フォームを作っています。 ラジオボタンだけが値をだしてくれません。 なにか方法はあるのでしょうか。 アンケートにつかいます。 各項目を答えるごとに裏でテキスト化されて最終的に一括送信できるようにします。

  • 親→子1→子2→親のデータ渡し

    1.親ウィンドウからサブウィンドウ1を開く。 2.サブウィンドウ１でsubmitボタンを押すと値が　　window.openerで親に渡り更にサブウィドウ2が開く。 ここまでは、出来るのですが 3.サブウィンドウ2でsubmitボタンを押して値を親ウィンドウに渡すにはどうしたらよいでしょうか？ ここでwindow.openerを使うとサブウィンドウ1が親ウィンドウと判断してしまい上手くいきません。 上手い方法があれば教えて下さい。

  • フォームのPOSTデータをサブウィンドウに渡したいです。

    フォームのPOSTデータをサブウィンドウに渡したいです。 <form action="sample.html" method="post"> <input type="checkbox" name="test[]" value="0">0 <input type="checkbox" name="test[]" value="1">1 <input type="checkbox" name="test[]" value="2">2 <input type="checkbox" name="test[]" value="3">3 <input type="checkbox" name="test[]" value="4">4 </form> 上記のフォームの値を、サブミットボタンを押したときにサブウィンドウをひらき、そのサブウィンドウに渡したいのですが、いまいち上手くいきません。 window.openでサブウィンドウを開いてもデータが受け渡せずにいます。 このような場合、どうしたら値を渡せるのでしょうか。 理想はPOSTで渡したいのですが、引数で渡す方法でもかまいません。

  • JavaScriptで以下のようなメールフォームを作成しているのですが

    JavaScriptで以下のようなメールフォームを作成しているのですが、確認画面がうまく表示されず困っています。項目が4～5個のテキストとセレクトボックスのフォームは動いたのですが、ラジオボタンやチェックボックス、画像アップロードを追加して項目を増やしたら、Scriptがよくわからなくなってしまいました。 ここに内容を書くと長くなるので以下のリンクのソースを参照いただけると助かります。 どうぞご教授のほどよろしくお願いします。 ■メールフォーム http://stage.chiikeys.jp/t_test/form/test.html ■確認ページ http://stage.chiikeys.jp/t_test/form/preview01.html

  • サブウィンドウからの値の取得について

    分からないことだらけですが、よろしくお願いします。 それは、サブウィンドウを開いて <input type="radio"...>のどれかを選択してボタンをクリックするとそれに対応した値が親ウィンドウのTextBoxに入力されるということをしたいのですが、うまくいきません。 textbox同士のSampleでしたらあるのですが、今考えているものに関してはなく、いろいろ試しているのですがよく分からなくなり混乱してしまいます。 よろしくお願いします。

  • javascriptで配列のような書き方をチェック

    多くのラジオボタンを用いてページを作っています。 test1_1 test1_2 test1_3 ... test1_XX とnameが続き、さらに一つ一つにはvalueが0と1というように複数並んでいるとします。 任意のvalueの値Yを持つnameはいくつあるのか、 XXまでの全てにチェックが入っているのか、 この2点を調べるコードはどのように書けばよいのでしょうか。

  • Javascriptでフォーム項目を変化させたい

    タイトル通りなのですが、Javascriptを利用して『入力するフォーム項目を変化させたい』と考えています。 参考になるページを探そうと思い検索しても、javascriptを勉強しはじめて間もない私が読めるようなページにHITしなくて(検索のワード選定が出来てないかもしれませんが…)困っています。 今回したいことは、 A・B・Cというラジオボタン(チェックボックス)があり、 <input type="radio" name="select" value="patarn_a">A <input type="radio" name="select" value="patarn_b">B <input type="radio" name="select" value="patarn_c">C Aにチェックを入れるとAに対応する入力項目(例えば項目1・項目2・項目3)が記入できるようになり、Bにチェックを入れると、Bに対応する入力項目(例えば項目1・項目3・項目4)が記入できるようになり、Cにチェックを入れると、Cに対応する入力項目(例えば項目2・項目5・項目6)が記入できるようにしたい、のです。 で、送信ボタンを押した時にA・B・Cのどこにチェックが入っているのか、それからその対応項目に入力された値をデータとして送りたいのですが、どうにも方法が分かりません。 もし、お手すきの方がいらっしゃいましたら、どなたかご教授頂けないでしょうか？

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

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

質問する