- ベストアンサー
フォームの途中で追加するには
簡単なブログシステムを作成しているのですが、その際タグを入力する欄があります。基本的にタグを一つ一つ入力していく形式をとりたいのですが、ユーザーによって入力したいタグ数が異なるため、まずはひとつだけタグ入力inputをつけました。 1タグ以上の入力は出来ないため、もう一つ入力するには タグを追加 のようなボタンを押すと、今までの入力した情報は失われず、フォームの最後に <input type="text" name="tag"> が追加されるようにしたいのですが、方法が分かりません。 一番苦戦している点は、別の項目で既に入力してある値をそのまま引き継ぎ、追加後も同じ状態で表示させたいです。 よろしくお願いいたします。
- Intel_404
- お礼率38% (213/548)
- PHP
- 回答数2
- ありがとう数1
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
こんな感じでしょうか <html></head> <script type="text/javascript"> var count_input = 0; function addElement() { if (count_input++==0) { var element = document.createElement('input'); element.setAttribute('type', "text"); element.setAttribute('name', "tag"); document.getElementById("input_add").appendChild(element); document.input_add.ad.disabled = true; } } </script> </head> <body> <form name="input_add"> <button name="ad" onclick="addElement()">追加</button><br> <input type="text" name="xx" value="前データ"/><br> </form> </body></html>
その他の回答 (1)
- nicolish
- ベストアンサー率72% (13/18)
>サーバーサイドで（PHP）で行いたいと考えています これはどう考えてもJavaScriptで処理するのが正解。サーバーサイドで処理する理由が何一つない。 それでも強いて言うなら、「タグを追加」ボタンで同じスクリプトにリクエストが飛んで、そこで入力内容とまったく同じ内容が再度フォーム部品内に表示されるようにすればいい。「タブを追加」もtype=submitにして、nameを別にするかなんかで「投稿」と「タグ追加」どっちが入力されたか判定すりゃ良い。 個人的には、カンマ区切りとか空白区切りとかで1テキストボックスに入力させた方が使いやすいと思うけどね。 タグを入力させるウェブサイトで、複数テキストボックスにいっこずつ入力させるサイトなんて見た事も無い。
補足
確かに他のシステムでは,を使用したりしていますが、今回は訳ありで使用できないのです。 また、すでにAjaxでできるようになっているのですが、Javascriptを使用できないユーザーにも追加できるよう、サーバーサイドでもできるようにしたいと思っています。 よろしくお願いいたします。
関連するQ&A
- テキスト・セレクトフォームにて何も入力されていない状態ではフォームの色を変えるためには
Rubyを使用して掲示板のシステムを作成しています。 必須項目 <input type="text" name="textfield"><br> 任意項目 <input type="text" name="textfield2"><br> 必須項目 <input type="text" name="textfield3"><br> 必須項目 <textarea name="textarea"></textarea><br> 必須項目 <select name="select"></select> と複数のテキストフォームとセレクトフォームがあり，その一部が必須項目です。そこで必須項目と分かるようにフォームの入力部分を赤く塗り，何か文字が入力されたら（何か選ばれたら），元の白の状態にしたいと考えています。 このようなことは実際可能なので使用か。ご教授お願いします。
- ベストアンサー
- HTML
- javascript 動的フォームの追加、削除について
JAVASCRIPTを使って、追加ボタンを押したときに、入力フォーム（textbox）を2個、3個と追加させ、入力フォーム横に設置した削除ボタンで削除ボタン横の入力フォームを削除したいと思っております。 1)delInput2()の引数でボタンごとの情報（何番目のボタンか）を渡したい。 どのようなjavascriptを書けばよいか、ご教授願えませんでしょうか。 どうぞよろしくお願い致します。 <script type="text/javascript"> var arInput = 0; var Default = arInput; function addInput() { //追加処理 arInput ++ $("#area").append('<span id=\"group'+arInput+'\"><input type=\"text\" name=\"text'+arInput+'\" value=\"入力項目'+arInput+'\" /><input type=\"button\" onclick=\"delInput2()\" name=\"button'+arInput+'\" value=\"削除'+arInput+'\" /><br></span>\n'); } function delInput() { //削除処理 $("#group"+arInput).remove(); if(arInput > Default){ arInput -- } } function delInput2() { //指定項目削除処理 } </script> <form> <fieldset id="area"> <fieldset> <input type="button" onclick="addInput()" value="一行追加" /> <input type="button" onclick="delInput()" value="一行削除" /> </fieldset> </form>
- ベストアンサー
- JavaScript
- フォームに入力後、別のフォームに値を表示
すみません。教えて頂けないでしょうか？（初心者です） <input type="text" name="a" id="aaa" size=20> ↓ <input type="text" name="b" id="bbb" size=20> ↓ <input type="text" name="c" id="ccc" size=20> ↓ このような感じで作成し、aとbのフォームに値が何か 入力されたら自動的に、例えばaとbの値を足してcのフォームに その結果を表示する様にしたいのですが、記述の仕方が なかなか見つけられません。
- 締切済み
- PHP
- フォームでのタグについて
検索フォームに IDを入力して ブログを表示するようなURLでリンクしたいと考えています。 <form method="get" action="http://blog.goo.ne.jp/" class="search" target="_blank"> <div> <input type="text" name="ID" class="textBox"><input type="hidden" value="/"> <input type="submit" value="検索" class="btn"> </div> </form> 上のようなhtmlタグを作りましたが うまく http://blog.goo.ne.jp/synchro-night/ http://blog.goo.ne.jp/(IDをフォームで入力)/ のようなリンクができません。 どのように変えればよいのでしょうか？ JavaScriptで する必要があるのでしょうか？
- ベストアンサー
- HTML
- フォームの値をリンクで渡す方法
ふつうはフォームで <input type = "text"> <input type = "hidden" name ="test1"> <input type = "hidden" name ="test2"> <input type = "hidden" name ="test3"> <input type = "hidden" name ="test2"> とやっていけばいくつものフォームの値を渡せますね。 今回はリンクにフォームの値を入れたいのです。 a href ="http://sig.com/win.cgi?text1=$text1&text2=$text2" test1はリンクの値。 text2がテキストボックスのフォームの値です。 どうやってtext2の値を上のハイパーリンクに入れられるでしょうか？ やはりJAVASCRIPTを使う必要があるでしょうか？ （他の質問で解決済み） フォームとリンクの値を同時にCGIに渡す方法を教えてください。 自分としては1つ1つ値を渡していくしかないか、と考えました。
- ベストアンサー
- Perl
- フォームの入力内容の後ろに文字を追加したい
いつもお世話になります。 KENTWEBのClipMailを使ってフォームメールを作っています。 http://www.kent-web.com/data/clipmail.html 郵便番号のフォームを以下のように作っているのですが、 <input name="zip" type="text">-<input name="zip" type="text"> こちらですと確認画面及び送信データの形式が「0000000」となります。 できれば「000-0000」というように受け取りたいと思っているのですが、間に任意の文字を挿入することは可能なのでしょうか。 inputをひとつにまとめてユーザーにハイホンを入れてもらう方法以外で解決方法をご存知の方がいらっしゃいましたら、ご教示ください。 よろしくお願いします。
- ベストアンサー
- CGI
- Webフォームについて
OCNの無料ホームページサービスで、Webフォームを作成しました。 （団体への加入申込みフォームです） 下記のフォームで、未入力欄がある場合、 ・未入力を再度促す画面に戻るには？ ・入力した内容を確認して送信するには？ ・送信が終わって「ありがとうございました」旨を知らせる画面を表示するには？ （OCNサービスに標準仕様でも送信thank you画面があるが、画面を閉じる機能がない） HTMLタグが判らないので、ご教授をお願いします。 <html> <head> <title> サンプルフォーム </title> </head> <b>△○○△会加入フォーム</b></p> <FORM METHOD="post" ACTION="/cgi-bin/formmail.pl"> <INPUT TYPE="hidden" NAME="recipient" VALUE="△△@○○.ocn.ne.jp"> <INPUT type="hidden" NAME="subject" value="登録" /><BR> あなたのE-mail<BR> <INPUT TYPE="TEXT" NAME="email"><br> あなたの氏名<BR> <INPUT TYPE="TEXT" NAME="氏名"><br> 住所<BR> <INPUT TYPE="TEXT" NAME="住所" /><br> コメント<BR> <INPUT TYPE="TEXT" NAME="コメント"><br> <INPUT TYPE="submit" ACTION="/cgi-bin/formmail.pl" VALUE="送信" METHOD="post"> <INPUT TYPE="reset" VALUE="クリア"><br> </form> </div> </body> </html>
- 締切済み
- その他（インターネット・Webサービス）
- 入力フォームが上手く動きません。。（mysql,php使っています）
入力フォームが上手く動きません。。（mysql,php使っています） レビュー系のサイトを作っていて、入力フォームを作ってみたのですが、上手く動きません。どなたかご助言いただけますと幸いです。 【関連するテーブル】 tag 構造 tagid , tag 1 , OPが素晴らしい 2 , EDが素晴らしい 3 , 世界観がいい ・ ・ ・ tag_title 構造 tagid , titleid , tagcom（コメント欄） , vote（今回は使いません） , tagcom_date（日付） 【組んだソース】 ============================== <?php if(isset($_GET['titleid'])){ if(preg_match('/^[0-9]+$/', $_GET['titleid'])){ $titleid = $_GET['titleid']; }else{ $titleid = 0; } }else{ //ダメな場合の処理 $titleid = 0; } (中略) $tag_array = array(); $tagcom_array = array(); if(isset($_POST['tag_regist'])) { $tag_array = $_POST['tag']; $tagcom_array = $_POST['tagcom']; extract($_POST); mysql_connect('***'); mysql_select_db('***'); $kyou = date("y-m-d"); $tagcnt = 0; for ($tagcnt=0;$tagcnt<count($tag_array);$tagcnt++) { $sql_tag = ""; $sql_tag = "INSERT INTO tag_title (tagid, titleid, tagcom, vote, tagcom_date) VALUES (".$tag_array[$tagcnt].", ".$titleid.", '".$tagcom_array[$tagcnt]."', '".$vote."', '".$kyou."')"; mysql_query($sql_tag); print $tagcom_array[$tagcnt]; } } print "<form action=\"tag_input.php?titleid=" . $titleid . "\" method=\"post\" >"; $sql2 = "select * from tag"; $result2 = mysql_query($sql2); $rows2 = mysql_num_rows($result2); while($row2 = mysql_fetch_array($result2)){ echo "<p><input type=\"checkbox\" name=\"tag[]\" value=\"" . $row2["tagid"] . "\" >"; echo $row2["tag"]; echo " <input type=\"text\" name=\"tagcom[]\" size=\"60\">"; echo "</p>"; } print "<p><input type=\"submit\" value=\"書き込む\" >"; print "<input type=\"reset\" value=\"リセット\"></p>"; print "<input type=\"hidden\" name=\"tag_regist\" value=\"true\" />"; print "</form>"; ============================== 【実際に作ってみたやつ（一例）】 ttp://www.game-minzoku.jp/tag_input.php?titleid=4784 【何ができないのか】 tag_titleidにデータを送りたいのですが、コメントのtagcomだけ上手くはいりません。。（たまにはることもあるので謎です。フォームなので100％の精度にしたいです） ソースは友人と協力して作ったのですが、どうしてもこのあたりで行き詰ってしまいました。 ソースの組み方にこだわりは全くないので、根本からの変更も可能です。 拙いご説明で大変恐縮ですが、お分かりになりましたらよろしくお願いいたします。 また、ご説明が足りない個所などあればおっしゃってください！
- ベストアンサー
- PHP
- フォームの一部をPOSTで送信できますか？
フォームのPOST自体をあまり理解できていないかも知れないのですが・・・ onClickイベントでJavascriptでパラメータを送信したいと思っています。 <input type="text" name="text1"> <input type="text" name="text2"> <input type="text" name="text3"> <input type="text" name="text4"> <input type="text" name="text5"> <input type="button" value="ボタン１"> <input type="button" value="ボタン２"> <input type="button" value="ボタン３"> というようなフォームがあった場合、ボタン１を押したらtext1とtext2の値を、 ボタン２を押したらtext1とtext3の値を・・・という風に 送信する内容を変えたいのですが、それをPOSTで渡すことは可能なのでしょうか？ ちなみに送信したい内容は、ボタンが違っても重なっているものもあります。 また可能であれば、どう記述すればよろしいでしょうか？（NNです） よろしくお願いします。
- ベストアンサー
- 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
お礼
ご回答ありがとうございます。 できればユーザーサイドではなくサーバーサイドで（PHP）で行いたいと考えています。