- ベストアンサー
郵便番号検索フォームにおけるJavascript 制御で質問です
失礼します。 郵便番号検索フォームを作成しているのですが、 サーバー側の仕様で、郵便番号を入力するtextbox の name値が固定されています。 必ず「name="p01:03"」と指定しなければなりません。 問題はname値に“：”が使用されているため、Javascriptがうまく動作しません。 ※フォーム（CGI）における値の受け渡しは問題ないです。 “：”を避けて実行する方法を探していますが、 うまくいきません。指示を頂けたらと思います。 --------------------------------- HTMLページの郵便番号欄： <form name="form">・・（略）・・・ 郵便番号：<input type="text" size="15" name="p01:03" value="" /> Javascript： 実行させるとindex.cgiのpost1へ値を飛ばします。 var target = 'http://www.テスト/index.cgi?template=zip.html&post1=' + document.form.p01:03.value; エラー：オブジェクトを指定して下さい。 ---------------------------------
- hyroki_124
- お礼率71% (5/7)
- JavaScript
- 回答数2
- ありがとう数3
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
問題点 (1)formにnameをつけて管理するのは非推奨 (2)さらに悪いのはformにつけた名前がズバリ「form」という予約語 であり、おそらくいろんなところで競合します。 解決策としてはformにidをふってgetElementByIdで得るか、 getElementsByTagName("form")で得たオブジェクトに番号でアクセスする。 たとえば <form id="form1"></form> に対しては、var f=document.getElementByTagName("form1") としてformオブジェクトをえるか、 var fs=document.getElementByTagName("form") var f=fs[0] などとする。 で、今回の件はformの子供要素にたいするアクセスなので#1さんの 指摘のようにするかelements要素を使います。 （form要素をfで受けているとしたとき・・・） f['p01:03']もしくはf.elements['p01:03']でアクセスできます
その他の回答 (1)
- SAYKA
- ベストアンサー率34% (944/2776)
>document.form.p01:03.value document.form['p01:03'].value または類似の指定方法だと どう？ http://www.tohoho-web.com/js/form.htm#elements http://www.tohoho-web.com/js/dom.htm#getElementsByName
お礼
SAYKAさん 回答ありがとうございます。 ばっちり動きました！感謝します。 参考サイトも参考になりました。
関連するQ&A
- javascriptのフォームデータをCGIで複数行取得
javascript内の変数を複数行のフォームでCGIに渡したいのです。 その際のコードが document.write("<form name='form1' action='xxx.cgi' method='post' enctype='text/plain'>"+ "<input type='hidden' name='state' value=''>"+ "<input type='hidden' name='state2' value=''>"+ "</form>"+ "<input type='button value='送信' onClick='tocgi(a,b)'>"); tocgi(n1,n2){ document.form1.state.value=n1; document.form1.state2.value=n2; document.form1.submit(); } なのですが、a、bの値がそれぞれ10、20だった時、一行目のフォームデータは出力されるのですが、２行目が出力されないのです。実行結果でいうとstate=10ですね。引数を一つにしても同じでした。何がいけないのか、全然わかりません…。それとも、CGIのコードの書き方に問題があるのでしょうか。でも、CGIの方は変えずに単純にHTMLで記述すると上手くいくみたいなんですよね。どなたかわかる方がいたら助けて下さい！
- 締切済み
- CGI
- フォーム内の値の指定方法
JavaScriptで、 フォーム内の値を指定するとき、どちらの記述がwebの標準として正しいのでしょうか？ document.form1.aaa.value form1.aaa.value 【フォーム】 <from name="form1"> <input type="textbox" name="aaa"> </form>
- ベストアンサー
- JavaScript
- フォームのname値を配列にしてJavaScriptでフォームのチェックをする方法
JavaScriptでフォームの半角数字のチェックをしたいのですが、 form内容をCGI(PHP)に渡すためname値を配列にしないといけないのですが、 以下のスクリプトだとエラーが出てしまいます。 *実際はif(isNaN～)と<input～>をループで書き出しており、行数が不特定なので それぞれ別のname値を使うことができない状態です。 <script language="JavaScript"> function check() { if(isNaN(document.form1.hoge[0].value)){ alert("値は半角数字で入力してください。"); return(false); } if(isNaN(document.form1.hoge[1].value)){ alert("値は半角数字で入力してください。"); return(false); } return(true); } </script> <form method="post" action="xxx.cgi" onSubmit="return check()" name="form1"> <input type="text" name="hoge[0]"> <input type="text" name="hoge[1]"> </form> 特にCGIに渡す必要がなければ <input type="text" name="hoge"> <input type="text" name="hoge"> としてやればチェックができるのですが、どうしても次の 処理があるためname値を配列にする必要があります。 解決方法がわかる方がおられましたらご教授ください。 以上よろしくお願いいたします。
- ベストアンサー
- JavaScript
- JavaScriptでメールフォーム
サイトでメールフォームをCGIを使わずに、JavaScriptで作成した時の話なのですが、 例えば、 <form name="mail" action="mailto:aaa@bbb.com" method="post" enctype="text/plain"> 名前<br> <input name="name"><br> 送信内容<br> <textarea style="WIDTH: 164px; HEIGHT: 50px" name="body"></textarea><br> <input style="WIDTH: 74px; HEIGHT: 21px" type="submit" size="37" value="送信"></form> ↑のような一般型のフォームは出来るのですが、 メールの送信先をメール送信者に指定させてそのアドレスにメールを送信するようにするにはどうしたら良いのでしょうか？ すみませんが御願いします・・・
- ベストアンサー
- JavaScript
- フォームで送信ボタンを押した際に、Javascriptに入力した値が渡
フォームで送信ボタンを押した際に、Javascriptに入力した値が渡せない タイトルそのままです。 ボタンを押したらJavascriptでフォームの値をとりたいのです 今は、 最初に取り込ませたいJavasprictをhead内に指定しておき、 <script language="JavaScript" src="/js/mc.js" type="text/javascript"></script> 本文中のformタグではは下文のようにしてあります。 <form id="form" name="ffform" action="#" method="post"> 送信用のボタンは画像で書き換えていて、ボタンを押すと、Javascriptの方で関数checkformを動かすようにしたいのです <input type="image" src="./img/submit.png" alt="送信" onclick="checkform()"> 実際に押してみても、ただ何も変化がなく、どうすればいいか困っています。どなたか教えてください actionのところにJavascriptを指定したら、Jsそのものを開いてしまいますし、cgiを置こうにも、今あるcgiは Javasprictからさらに値を渡す為にあるcgiだけなのです・・・・・・
- ベストアンサー
- HTML
- javascript フォームについて
javascriptでフォームを作ったのですが、複数フォームの空白をチェックするにはどのようなプログラムにすればよろしいでしょうか？ onsubmit="return chk1(this)でフォーム送信が押されたときにチェックを行おうと考えているのですが そのときのchk()の中身やif文の条件がわからないのです。 どのようにすれば上手くいくでしょうか？ 回答よろしくお願いします。 ソースは以下のとおりです。 <script language="javascript"> function send() { document.nform.submit(); document.nform2.submit(); document.nform3.submit(); } function chk1(frm){ if(frm.elements["txt1"].value==""){ alert("解答欄に空白があります"); /* FALSEを返してフォームは送信しない */ return false; }else{ /* TRUEを返してフォーム送信 */ return true; } } </script> <form name="nform" method="POST" action="mailto:webmaster@a.com?subject=問い合せ" enctype="text/plain"> <p>問1</p> <p> (1)<input type="text" name="kaitouran11" size="20"> (2)<input type="text" name="kaitouran12" size="20"> (3)<input type="text" name="kaitouran13" size="20"> (4)<input type="text" name="kaitouran14" size="20"> </p> </form> <form name="nform2" method="POST" action="mailto:webmaster@leposystems.com?subject=問い合せ" enctype="text/plain"> <p>問2</p> <p> (1)<input type="text" name="kaitouran21" size="20"> (2)<input type="text" name="kaitouran22" size="20"> (3)<input type="text" name="kaitouran23" size="20"> (4)<input type="text" name="kaitouran24" size="20"> </p> </form> <form name="nform3" method="POST" action="mailto:webmaster@leposystems.com?subject=問い合せ" enctype="text/plain"> <p>問3</p> <p> (1)<input type="text" name="kaitouran31" size="20"> (2)<input type="text" name="kaitouran32" size="20"> (3)<input type="text" name="kaitouran33" size="20"> (4)<input type="text" name="kaitouran34" size="20"> </p> </form> <input type="button" value="送信" onClick="send()" onsubmit="return chk1(this)">
- ベストアンサー
- JavaScript
- chromeでフォームの値が取得できない
PHPでフォームに入力された値を取得して画面に表示させる処理において、 Javascriptでフォームの値を変更した場合、chromeだと変更後の値が 取得できません。 例えば、 <form name="form" method="post" action="index.php"> <input type="checkbox" name="chk1" value="111"> <input type="hidden" name="data1" value="AAA"> <input type="submit" value="送信"> </form> というようなフォームがあったとして、Javascriptで値を <form name="form" method="post" action="index.php"> <input type="checkbox" name="chk1" value="222"> <input type="hidden" name="data1" value="BBB"> <input type="submit" value="送信"> </form> と、変更しても送信ボタンを押して取得できる値は、上の方の値になります。 IEやFireFoxでは問題なく変更後の値が取得できるのですが、chromeだと 取得できません。 なにか解決方法があるのか、それともchromeの仕様なのかご教示いただければと 思います。 どうかよろしくお願いいたします。
- 締切済み
- JavaScript
- JavaScript制御のフォームを1ページに複数設置するには？
先日こちらのサイトで、1つのセレクトボックスで1度に複数の情報をCGIに渡す方法を教えて頂き、 <script type="text/javascript"> <!-- function func() { var n = document.F1.S1.selectedIndex; var d = document.F1.S1.options[n].text.split(" "); document.H1.AA1.value=d[1].slice(0,-1); document.H1.AA2.value=d[0]; document.H1.AA3.value=document.F1.T1.value; document.H1.submit(); } // --> </script> <form name="F1" action="#"> <select name="S1"> <option>3本セット 100円 <option>7本セット 200円 </select> <input type="button" value="カートへ" onclick="func()"> </form> <form name="H1" action="cart.cgi"> <input type="hidden" name="AA1"> ・ ・ <input type="hidden" name="AA3"> </form> というフォームを作ったのですが、同じページに同様のフォームがもう一つ必要になりました。 そこで上記ソースに、フォーム名や変数名を変えたScript <script type="text/javascript"> <!-- function func() { var n = document.F2.S2.selectedIndex; var d = document.F2.S2.options[n].text.split(" "); document.H2.AA4.value=d[1].slice(0,-1); document.H2.AA5.value=d[0]; document.H2.AA6.value=document.F2.T2.value; document.H2.submit(); } // --> </script> を追加し、 これに対応するフォームも追加したのですが、1つめのフォームから「カートへ」でデータを送っても2つめのフォームの内容が送信されてしまいます。 どこをどう直したらよいのでしょうか？
- ベストアンサー
- JavaScript
- JavaScriptでフォームへのフォーカス処理
PHP、XHTML、CSSで応募フォームの作成をしております。 PHPとHTMLは別ファイルで作成しており、PHPにアクセスしてそのPHPが指定されたテンプレートを読みにいくような流れとなっております。 HTMLもPHPも完成して、応募フォームとして一通り動くようになったのですが、新たにフォーカス機能を追加したいということになりました。 具体的には、応募フォームの一番最初のテキストエリアに、ページ読み込み時にフォーカスを当てたいという内容です。 そこで、フォーカス機能用のJavaScriptを別ファイルで新たに作成し、動きを確認してみたところ上手く動きません。 HTMLとJavaScriptのソースは下記の通りです。 ==================================================================== ■HTML(全て書くと長くなってしまうので、簡略させていただきます) <script type="text/javascript" src="$path_top_js/focus.js"></script> <body onLoad="Focus()"> </head> <form name="top" action="index.php" method="POST" onReset="return false;" onSubmit="return false;"> <input type="hidden" name="USER_ID" value="$USER_ID"> <INPUT size="20" type="text" name="USER_ID" value="$USER_ID" MAXLENGTH="10"> </form> </body> ■JavaScript(focus.js) function Focus(){ document.top.USER_ID.focus(); } ==================================================================== 「フォームのname="USER_ID"というテキストエリアにフォーカスを当てる」という内容になります。 なぜフォーカスが当たらないのか、原因は予想がつくのですが、どう解決していいのか分かりません。 多分、フォームの値を保持するために記述しているhiddenタグ <input type="hidden" name="USER_ID" value="$USER_ID"> にJavaScriptのフォーカスが当たってしまっているみたいです。(フォーカスが当たっていると思われるhiddenタグは見ることができません) 試しにhiddenタグを外してみたところ、JavaScriptで指定したテキストエリアにフォーカスが当たっていることを確認しました。 「応募フォーム」ということで、ページ遷移した際にもフォームに入力した値を保持しておくためにhiddenタグは外したくないのですが、フォーカス機能もちゃんと動くようにしたいと思っております。 解決方法が分かる方いらっしゃいましたら、ご教授の程お願い致します。
- ベストアンサー
- HTML
- javascript php フォームについて
javascriptで作ったフォームをphpに送信したいのですが、上手く送信できません。 どのようにすれば上手く送信することができるでしょうか？ 回答お願いします。 javascript側のソース <body> <form name="nform1" method="POST" action="./kaitou1.php" enctype="text/plain"> <p>問1</p> <p> (1)<input type="text" name="kaitouran11" size="20"> (2)<input type="text" name="kaitouran12" size="20"> (3)<input type="text" name="kaitouran13" size="20"> (4)<input type="text" name="kaitouran14" size="20"> </p> </form> <form name="nform2" method="POST" action="./kaitou1.php" enctype="text/plain"> <p>問2</p> <p> (1)<input type="text" name="kaitouran21" size="20"> (2)<input type="text" name="kaitouran22" size="20"> (3)<input type="text" name="kaitouran23" size="20"> (4)<input type="text" name="kaitouran24" size="20"> </p> </form> <form name="nform3" method="POST" action="./kaitou1.php" enctype="text/plain"> <p>問3</p> <p> (1)<input type="text" name="kaitouran31" size="20"> (2)<input type="text" name="kaitouran32" size="20"> (3)<input type="text" name="kaitouran33" size="20"> (4)<input type="text" name="kaitouran34" size="20"> </p> </form> <input type="button" value="送信" onClick="send()"> </body> php側のソース <body> <p>問1</p> <p>(1)<?php print(htmlspecialchars($_POST['kaitouran11'], ENT_QUOTES, 'UTF-8')); ?> (2)<?php print(htmlspecialchars($_POST['kaitouran12'], ENT_QUOTES, 'UTF-8')); ?> (3)<?php print(htmlspecialchars($_POST['kaitouran13'], ENT_QUOTES, 'UTF-8')); ?> (4)<?php print(htmlspecialchars($_POST['kaitouran14'], ENT_QUOTES, 'UTF-8')); ?> </p> <p>問2</p> <p>(1)<?php print(htmlspecialchars($_POST['kaitouran21'], ENT_QUOTES, 'UTF-8')); ?> (2)<?php print(htmlspecialchars($_POST['kaitouran22'], ENT_QUOTES, 'UTF-8')); ?> (3)<?php print(htmlspecialchars($_POST['kaitouran23'], ENT_QUOTES, 'UTF-8')); ?> (4)<?php print(htmlspecialchars($_POST['kaitouran24'], ENT_QUOTES, 'UTF-8')); ?> </p> <p>問3</p> <p>(1)<?php print(htmlspecialchars($_POST['kaitouran31'], ENT_QUOTES, 'UTF-8')); ?> (2)<?php print(htmlspecialchars($_POST['kaitouran32'], ENT_QUOTES, 'UTF-8')); ?> (3)<?php print(htmlspecialchars($_POST['kaitouran33'], ENT_QUOTES, 'UTF-8')); ?> (4)<?php print(htmlspecialchars($_POST['kaitouran34'], ENT_QUOTES, 'UTF-8')); ?> </p> </body>
- 締切済み
- PHP
お礼
なるほど。 解決策だけでなく問題の指摘も頂けて嬉しく思います。 しかも他にもこんな方法があったなんて、、、 今後の参考になります。 ありがとうございました。