• ベストアンサー

JavaScriptのフォームの確認画面でラジオボタン・チェックボック

JavaScriptのフォームの確認画面でラジオボタン・チェックボックスが反映されず「undefined」になってしまいます。いろいろ調べたのですが適当なものが見つかりませんでした。 また、「業種1」「業種2」のセレクトボックスをJavaScriptで制御しているのですがIEでは確認画面に反映されませんでした。（Firefoxでは表示されました） またフォームで選択した画像をサムネイルで表示し、それを送信しようと思ったのですがJavaScriptで可能でしょうか？ ここに内容を書くと長くなるので以下のリンクのソースを参照いただけると助かります。 どうぞご教授のほどよろしくお願いします。 ■メールフォーム http://stage.chiikeys.jp/t_test/form/test.html ■確認ページ http://stage.chiikeys.jp/t_test/form/preview01.html

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

  • ベストアンサー
  • steel_gray
  • ベストアンサー率66% (1052/1578)
回答No.2

＞フォームで選択した画像をサムネイルで表示し、それを送信 Javascriptではできません。 入力画面でサーバ側プログラム(asp?)に送信、実際にサーバに保存して確認画面を出す必要があります。 画像表示の必要がなくとも<input type="file">のデータはJavascript、cookieで受け渡しする事は不可能ですので現状の方式ではダメで、入力画面からサーバへの送信は必須です。 （あるいは画像の入力は確認画面の方でさせる） なお、optionのvalue省略時の扱いはHTMLの規定通りです。 経験上、省略しない方が安全な気はしますけど。

miya7337
質問者

お礼

ご指摘ありがとうございました。 もう一度最初からどういう方向が最適か検討します。

その他の回答 (2)

  • think49
  • ベストアンサー率59% (285/482)
回答No.3

#1です。 >> #2 steel_grayさん > なお、optionのvalue省略時の扱いはHTMLの規定通りです。 HTML4.01で規定されていたんですね。ご指摘ありがとうございます。 ------- OPTION要素の属性定義 value = cdata [CS] この属性は、当該コントロールの初期値を指定する。この属性が設定されていない場合、初期値はOPTION要素の内容となる。 http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/interact/forms.html#h-17.6 -------

  • think49
  • ベストアンサー率59% (285/482)
回答No.1

とりあえず、<option> にvalue値が入っていません。 「<option> にvalue値がない時に、<option>hoge</option> の "hoge" をvalue値とするブラウザの仕様」って始めて知りましたが、はっきりいって規定外の動作だと思います。 あと、気になることがちらほら。 ・<form> は入れ子に出来ません。 ・FirefoxやChromeでも項目が一つずれて表示されます。 ・Chromeで「<> is not allowed inside <tr>. Inserting <> before the <table> instead. Line:251」ってエラーが発生します。 ・氏名、電話番号などの個人情報をCookieで送信するのはちょっと…。 IE8なら、[F12] で開発者ツールを起動できるので、生成したDOMツリーを確かめてみてください。 Firebugと違って、DOMが変更されたときに自動更新してくれないので、更新する度に [最新の情報に更新] (F5) を押す必要があります。 HTMLの間違いが多いので、一度見直すことをお勧めします。 http://openlab.ring.gr.jp/k16/htmllint/htmllint.html

miya7337
質問者

お礼

ご指摘ありがとうございます。 ＨＴＭＬの間違いなど見直していきたいと思います。 また、このフォームに関しても方向性を検討し直していこうかと思っております。

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

関連するQ&A

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

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

  • javascript　ラジオボタン

    javascriptのことで質問させてください。 よろしくおねがいします。 簡単なフォームをテーブルで作成しています。 例えばの例でお願いします。 <form action="" method="post"> <table> <tr> <td>表示/非表示<td> <td><input type="radio" value="1">非表示 <input type="radio" value="2">表示<td> <tr> <!--ここから表示/非表示部分--> <tr> <td>テキスト<td> <td><input type="text"><td> <tr> <!--ここまで表示/非表示部分--> </table> </form> 上記のようなフォームがあったとします。 PHPを使用していまして、 『hoge.html?str=値』　がアドレスとします。 $str=$_GET['str']; $str=1 の時は、はじめは表示 $str=2 の時は、はじめは非表示 $str="" の時は、はじめは非表示 という感じの内容でラジオボタン選択すると表示/非表示されると言うものを作成したいと思っています。 説明がわかりにくいと思いますがどうぞよろしくお願いします。

  • ラジオボタンをタイトルに

    　フォームメールでフォームで選んだラジオボタンの値をタイトルに付けたいのですが、どうすればよいのでしょうか？私はこのようにしてるのですが <form method="post" name="mail" enctype="text/plain" onsubmit="document.mail.action='mailto:メールアドレス?subject=' + document.mail.elements['ボックス名'].value + document.mail.ラジオボタン名.checked"> これでやるとボックスの値はタイトルになるのですが、ラジオボタンの値がundefinedとなってしまうのです。 　ラジオボタンで４択にした結果もタイトルに表示する方法は無いものでしょうか？どうか教えて下さい。

  • cgiのフォーム確認画面で教えてくださいー

    cgiのフォームの確認画面でこまってます。 ラジオボタンの確認はいかで問題なくできています。 END for($xa = 1; $xa < @list_d; $xa++){print '<input name="kai" value="'.$xa.'" type="radio"'; if($form{'kai'} == $xa){print ' checked'; $ch++;} print '>'.$list_d[$xa].'&nbsp;';} print<<END; ・・・同じ要領で、チェックボックスも表示させたいのですが いかですと、うまく表示できません。 END for($xa = 1; $xa < @list_e; $xa++){print '<input name="q2" value="'.$xa.'" type="checkbox"'; if($form{'q2'} == $xa){print ' checked'; $ch++;} print '>'.$list_e[$xa].'&nbsp;';} print<<END; …チェックボックスの場合は何か違う指示が必要なのでしょうか。 どなたかお分かりの方教えていただけますか。 どうぞよろしくおねがいいたします。

    • 締切済み
    • CGI
  • HTMLのフォーム名とJavaScriptの関数名

    JavaScriptを勉強し始めたばかりの者です。 submitボタンがonClickされたときにcheckという関数を呼び出しているのですが、 フォーム名とJavaScriptの関数名を同じものにすると、その関数が呼び出されなくなっているようなのです。 ------------------ form.html ----------------------------------------------------- <html> <head> <meta http-equiv="Content-type" content="text/html; charset=euc-jp"> <script type="text/javascript" src="test.js"></script> <link rel="stylesheet" type="text/css" href="style.css"> <title>フォーム</title> </head> <body class="blue" marginwidth="100" topmargin="40" bottommargin="80"> <form name="check" method="post" action="form2.cgi"> <table border="1" cellpadding="7"> <caption>フォーム</caption> <tr> <td>※ID</td> <td><input type="text" name="id"></td> <td>テキストボックス</td> </tr> </table> <br> <input type="submit" name="send" value="送信" onClick="check()"> <input type="reset" name="clear" value="リセット"></td> </form> </body> </html> ------------------ test.js ------------------------------------------------------- <!-- function check() { if( document.check.id.value == "" ){ alert( "※のついている項目は入力必須項目です！" ); } return; } --> ------------------------------------------------------------------------------- 上記のソースで、テキストボックスに何も入力せずに送信ボタンを押してもalertは表示されませんが、 フォーム名あるいは関数名のどちらかをcheck1やcheck_1にすると表示されるようになります。 フォーム名と関数名を同じものにするとalertは表示されません。 フォーム名と関数名の関係はこのようなものなのでしょうか？ また上記のソースに原因があるようでしたらお教えください。

  • ラジオボタンの値を・・・・・

    <html> <head> <script language="javascript"> function osu(){ document.form1.text1.value=document.form1.radio1.value; } </script> </head> <body> <form name="form1"> <input type="radio" name="radio1" value="男" checked>男 <input type="radio" name="radio1" value="女">女 <input type="button" value="押す" onClick="osu()"> <input type="text" name="text1"> </form> </body> </html> ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー 上記のプログラムは、選択されたラジオボタンの値をテキストボックスに表示させるプログラムなんですが、何故かラジオボタンの値が表示されず、「undefined」というのが表示されます。 どうすれば、「男」または「女」という値を表示させることができますか？ ちなみにこれは、「○○○．ｈｔｍｌ」で保存します

  • テキストボックスに入力されたらラジオボタンにチェック

    いつもお世話になっております。 タイトル通りなのですが テキストボックスに入力された時に、チェックボックスや ラジオボタンににチェックが付くようなJavaScriptを思考しています。 test.php ---------------------------------------- <form name="form1" method="post" action="test.php"> <input type="checkbox" name="235[]" value="1"> <input name="394" type="text" style="ime-mode: active" onchange="text_check('235')" value="" /> </form> script.js ---------------------------------------- function text_check(nm) { 　obj = document.form1; 　alert(obj.elements[nm + '[]'].length);　// アラートで「undefined」と出てしまう。 　for( i=0; i<obj.elements[nm + '[]'].length; i++){ 　　obj.nm[i].checked = true; 　} } フォームのラジオボタン、テキストボックスのname属性は 数字じゃない場合は、問題なさそうなのですが 数字の場合だとうまく動作してくれません。 name属性を変更することは考えていません。 ご教示よろしくお願いいたします。

  • javascriptを使った自動計算→送信

    https://sv62.xserver.jp/~healing-rose/healing-rose.com/form_test/order_form.php こちらのサイトのような感じの注文フォームを作成したいと思っています。 そこで、上記のサイトで言う、「品種選択　×　本数」の自動計算の部分をjavascriptで作成しました。 そして自動計算した金額と、商品名・個数を反映させた注文フォームを PHPで作りたいと思っています。 PHPの知識は、人が作ったものをカスタマイズする程度しかないのですが、 いつも通りフォームを作ったら自動計算された部分が送信確認の画面で表示されなくなってしまいました。 自動計算の部分は http://www.tagindex.com/javascript/form/comp1a.html このサイトに書いてある通りにしているのですが、 例えば <td>商品サンプル2</td> <td align="right">1,000円</td> <td><select name="goods2" onChange="keisan()"> <option>0</option> <option>1</option> <option>2</option> <option>3</option> <option>4</option> <option>5</option> </select></td> この部分の「select name="goods2"」をそのまま<?php echo($str_goods2); ?>としても反映されないんです…（当たり前ですか？） そこで聞きたいのですが、javascriptで自動計算したあとに、参考サイトのような感じで 注文フォーム→送信ということは可能なのでしょうか？ PHPで自動計算…等検索してみたのですが、自動計算になるとjavascriptしか出てきません。 参考サイトの注文フォームと同じようなものの作り方を教えてください。

  • フォーム2つを並列処理

    フォーム1に配置されたボタンをクリックすると、フォーム2とフォーム3が起動します。 フォーム2、フォーム3共に配置されたテキストボックスを同時に制御したいのですが、 どうしたらいいのかわかりません。 フォーム2のコード途中にテキストボックスに「テスト」と記入するコードがあります。 ----------------------------------------- TextBox1.Text = "テスト" Form2.TextBox1.Text = "テスト" ----------------------------------------- これで実行してみたのですが、Form2には繁栄されるのですが、Form3には繁栄されません。。。

  • フォームの内容を確認画面で表示

    以前ご質問した内容で、改良したい部分があって、ご質問しました。 以前の質問は、 フォームで必要事項を入力してもらい（テキストやコンボなど）、「確認」みたいなボタンを押すと、入力した必要事項が確認できるものを作りたいのですが。 その値をメールで送信やDBに書き込むような作業はしない予定です。 単純に表示が出来ればOKです。 その画面を印刷して使用するものなので。 というものでした。 テキストボックスとコンボについては、出来ましたが、 チェックボックス、ラジオボタンの場合、どのように確認画面で表示すれば良いのかわからずご質問しました。 確認画面では、チェックボックスの値をテキストで表示するのではなく、 チェックボックスそのものを表示して、チェックの有無を確認できるようにしたいのですが（チェックをはずしたり出来る状態） 同じようにラジオボタンも選びなおせるようにしたいのです。 前回の投稿のURLはhttp://oshiete1.goo.ne.jp/kotaeru.php3?q=1014263 です。 使用したソースは、 michisanpoさんにお答え頂いたものを元にして使用しています。

    • ベストアンサー
    • Perl

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

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

質問する