strutsを使ったテキストエリアの表示・非表示について
- ラジオボタンを使用して、チェックを入れるとテキスト入力欄が表示される仕組みを作りたい場合、strutsを使うことができます。チェックが外れるとテキスト入力欄が非表示になるようにするには、JavaScriptを使用する必要があります。
- 具体的な実装方法は、ラジオボタンのonClickイベントでJavaScriptの関数を呼び出し、テキスト入力欄の表示・非表示を切り替えることができます。strutsのラジオボタンのプロパティには、チェックが変更されたイベントが発生したときに呼び出すJavaScript関数を指定することができます。
- また、strutsのテキスト入力欄のproperty属性には、テキスト入力欄の値を格納するための変数を指定することができます。これにより、テキスト入力欄に入力された値をサーバーに送信することができます。
- ベストアンサー
strutsを使ってテキストエリアを表示・非表示に
いつもお世話になっております。 またまた詰まってしまいましたので、どなたかご教授お願いいたします。 ラジオボタンを使ってチェックを入れる項目があります。 その中の一つにチェックを入れると、隣、もしくは横にテキスト入力欄が表示されるようにしたいのです。 そして、そのチェックが外れて他の項目がチェックされると表示されたテキスト入力欄が消えるようにしたいと思うのですが、どうすれば良いのでしょうか? <html:radio property="searchType" value="1" onclick="javascript:Change1" />注文番号 <html:radio property="searchType" value="2" onclick="javascript:Change2" />品名 <html:text property="searchId" /> ここまでで、function部分をどうかけば良いかわかりません。。。 お助けください。おねがいします。 一人で勉強してるので、なにぶん効率が悪いです。
- somehow123
- お礼率56% (44/78)
- Java
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
申し訳御座いません。先ほどのHTMLはあくまでstrutsを通して出力されたHTMLソースを例として書いたものでして、これだけでわかると思ってました。 <html:html> <head> <script type="text/JavaScript"> function Change1() { document.form1.searchId.style.visibility = "visible"; } function Change2() { document.form1.searchId.style.visibility = "hidden"; } </script> </head> <body> <html:form name="form1" action="?????"> <html:radio property="searchType" value="1" onclick="javascript:Change1()"/>注文番号 <html:radio property="searchType" value="2" onclick="javascript:Change2()"/>品名 <html:text property="searchId"/> </html:form> </body> </html:html> こんな感じになるのかな。 動作は未確認ですが、これを基に動くようにすればいいと思います。
その他の回答 (1)
- chomakichi
- ベストアンサー率57% (22/38)
こんなんでどうですかね～ <html> <head> <script type="text/JavaScript"> function Change1() { document.form1.searchId.style.visibility = "visible"; } function Change2() { document.form1.searchId.style.visibility = "hidden"; } </script> </head> <body> <form name="form1"> <input type="radio" name="searchType" value="1" onclick="javascript:Change1()" checked/>注文番号 <input type="radio" name="searchType" value="2" onclick="javascript:Change2()"/>品名 <input type="text" name="searchId" value=""/> </form> </body> </html>
お礼
回答ありがとうございます。 strutsを使っているので、chomakichiさんの書かれたソースだとエラーがでてしまいます。 strutsではinput type で name属性が使えません。。。。
関連するQ&A
- strutsでラジオボタンを非活性にしたい
プログラミング初心者です。ご指導お願いします。 strutsを使って、（javascriptを使うんだと思うのですが） 二つあるラジオボタンで、ひとつを選択後、実行して 同じページに結果を返したときに、結果表示ページで変更できないようにラジオボタンを非活性にしたいのですが、なかなかうまくできません。 ソースはこんな感じです。 <html:radio onclick="radiocheck()" property="searchType" value="1" />注文番号 <html:radio onclick="radiocheck()" property="searchType" value="2" />品名 function JS_DoInit( a_numType ) { switch ( a_numType ){ case M_NUM_SCREEN_INIT_TYPE_INIT: break ; case M_NUM_SCREEN_INIT_TYPE_LIST: document.all("radiocheck")[0].disabled = true; document.all("radiocheck")[1].disabled = true; ラジオボタンは配列になってるので、順番を指定すればいいのかなと思って上記のようなソースを書いて見ました。 どう直せばよろしいでしょうか。ご指導お願いします。 一人で勉強していて、詰まってしまい質問させていただきました。 助けていただけるとありがたいです
- 締切済み
- Java
- ラジオボタンにチェックを入れて、テキストボックスのコメントを消すには
どなたかお力を・・・ 宜しくお願いします。 メールフォームを作成していて、 テキストボックス入力欄 ○ラジオボタン01 ○ラジオボタン02 から、１箇所選択してもらうようにしてあります。 テキストボックスに始めから、例を記入してあるのですが、 ラジオボタンにチェックを入れた際に消えるようにしたいのです。 フォームのコメントを消すjavascriptは変更してもらっても構いません。 <INPUT type="text" name="あいうえお" onfocus="if (this.value == '例）Corneometer') this.value = '';" onblur="if (this.value == '') this.value = '例）テスト';" value="例）テスト"> <INPUT type="radio" name="かきくけこ" value="ラジオ01" onClick="check_reset(this,10)">ラジオ01 <INPUT type="radio" name="かきくけこ" value="ラジオ02" onClick="check_reset(this,11)">ラジオ02
- ベストアンサー
- JavaScript
- onclickでテキストエリアの末尾にカーソルを入れるには
<A HREF="javascript:function voi(){};voi()" onClick="document.main.message.value='私たちは'">記入する</A> 上記をクリックしたときにテキストエリアに「私たち」が入力されますが、そのあとにカーソルを持っていく方法をお知らせいただけないでしょうか。
- ベストアンサー
- JavaScript
- 複数行を独立してテキストエリアに表示させたい
皆さんの回答にはいつもお世話になっている、javascript初心者です。 普段はネット上から必要なソースをコピー・改変して利用していますが、 今回はその内容を拡張する必要があったため、その方法が分からず質問させて頂きます。 まず、以下のソースを作成しました。 <html> <head> <meta http-equiv="content-type" content="text/html; charset=shift_jis" /> <script> function update(form) { form.hoge4.value = form.hoge0.value + '\ '; if(form.hoge1[0].checked) { form.hoge4.value += form.hoge1[0].value + '\ '; } else if (form.hoge1[1].checked) { form.hoge4.value += form.hoge1[1].value + '\ '; } else if (form.hoge1[2].checked) { form.hoge4.value += form.hoge1[2].value + '\ '; } else if (form.hoge1[3].checked) { form.hoge4.value += form.hoge1[3].value + '\ '; } if(form.hoge2[0].checked) { form.hoge4.value += form.hoge2[0].value + '\n'; } else { form.hoge4.value += form.hoge2[1].value + '\n'; } } </script> </head> <body> <form action=""> 名前：<input type="text" name="hoge0" value=""> 趣味 <input type="checkbox" name="hoge1" value="ゲーム">ゲーム <input type="checkbox" name="hoge1" value="PC">PC <input type="checkbox" name="hoge1" value="釣り">釣り <input type="checkbox" name="hoge1" value="車">車 配偶者 <input type="radio" name="hoge2" value="あり">あり <input type="radio" name="hoge2" value="なし">なし <br> <br> <textarea name="hoge4" value="" rows="5" cols="40"></textarea> <br> <button type="button" onclick="update(this.form);">内容反映</button> <input type="reset" value="リセット"> </form> </body> </html> この内容は、テキストボックスとチェックボックスとラジオボタンの組み合わせを ボタン押下で下部のテキストエリアに反映させるというものです。 現状では、 1,テキストボックスが1つ 2.チェックボックスは複数あるうち1つを選択した場合しか反映されない 3.名前～なしまでが回答項目だが、1行(1人分)しかない という内容ですが、これをテキストボックスとチェックボックスとラジオボタン の配置順は変えず、以下のように変更する事を希望しています。 1,テキストボックスが2つ 2.チェックボックスは複数あるうち単数/複数どちらを選択した場合でも全て反映される 3.名前～なしまでの回答項目を、複数行(30人分を想定しています)作成し、反映結果は 田中 ゲーム 車 あり 鈴木 ゲーム 釣り あり 伊藤 釣り 車 なし … … のようにそれぞれの項目は半角スペースを空けて、ラジオボタンの回答項目のところで 改行する、というものにする。 私は1つのまとまり（今回はテキストボックスとチェックボックスとラジオボタン）を テキストエリアに反映させる仕組みは分かったと思うのですが、この「まとまり」が 複数になったときに応用がきかず困っています。 不勉強の私ですが、皆さんのお力添えをどうぞ宜しくお願い致します。
- 締切済み
- JavaScript
- テキスト入力の制御
<input type="text" name="num" value="" /> <input type="checkbox" name="check" value=""> とテキストとチェックボックスがあるとします。 チェックボックスにチェックをした段階でページの切り替えなどを しなくてもテキストのnumを入力できない状態にしたいのですが どうすれば可能でしょうか？ 可能であれば先にテキストを入力している段階でもチェックをすれば 入力してあるテキストを無効にし入力できない状態に切り替えたいと 思っております。 どちらかの入力を必須項目としエラーチェックはphpで行うのですが javascriptで入力を制御する方法がわかりません。
- ベストアンサー
- JavaScript
- ボタンをクリックするとテキストエリアに文字が表示される。
はじめまして 下記内容のJavaScriptを見つけたのですが これをどうにか違うものにしたいのです。 <html> <head> <TITLE>テキストエリアに複数項表示する</TITLE> <script language="JavaScript"><!-- function setChars() { str1="テキストエリアに"; str2="複数項にわたる文字を"; str3="表示します。"; document.myFORM.myTEXT.value=str1+"\n"+str2+"\n"+str3; } /--></script> </head> <body> <form name="myFORM"> <textarea name="myTEXT"rows="10"></textarea><br> <input type="button"value="複数行表示"onClick="setChars()"> </form> </body> </html> ------------------------------------------------ 例えば （月・火・水・木）とそれぞれのボタンがあるとします。 そのボタンを押すと、複数行テキストへ 月曜→○○○○ 火曜→○○○○ 水曜→○○○○ 木曜→○○○○ というように、表示させたいのです。 また、複数行テキストに入力された文字が消えず改行されて表示させたいのです。 自分でもいろいろと試してみたのですが、頭が悪く、全く思ったようにできません。 お忙しいところ大変申し訳ありませんが、 上記に記載した内容のスクリプトはありますでしょうか。 ご返答いただけると幸いです。
- ベストアンサー
- JavaScript
- 左右に並べたオブジェクトの表示非表示を行いたい
上下に並べたボタンとテキスト入力欄の表示非表示は、INPUTオブジェクトのプロパティー、「style="display:none(block)」をJavaScriptで操作することによって可能だと思うのですが、「style」プロパティーの設定を行うと、上下にボタン、テキスト入力欄が表示されてしまいます。オブジェクトを左右に表示して、表示非表示をきる替えることはできないでしょうか？よろしくお願いします。
- 締切済み
- JavaScript
- テキストエリア内で改行するには。
次のスクリプトを実行すると、テキストエリア内に 01234560 と数字が表示されますが、これを 0 1 2 . というように改行も含めてテキストエリアに出力するにはどうすればよいでしょうか。 ￥ｎという文字を使用するのでしょうか？ <html> <head> <script language="JavaScript"> <!-- var textA="" function my1() {for (i=0;i<11;i++){textA=textA+new String(i)} document.form1.text1.value=textA;} //--> </script> </head> <body> <form name="form1"> <textarea name="text1" size="10"></textarea> <input type="button" value="CLICK!" onClick="my1();"> </form> </body> </html>
- ベストアンサー
- JavaScript
- 特定のラジオボタンが選択されたらテキストフィールドを入力可
下のような6つのラジオボタンと1つのテキストフィールドのあるフォームがあります。 「あ・い・う・え・お」のラジオボタンが選択されたらテキストフィールドをdisabledに、「か」なら入力可能にしたくて、JavaScriptで次のように記述しました。 一応動作しているように見えるのですが、見よう見まねで書いた初めてJavaScriptなので大丈夫なのか不安です。これで良いのでしょうか。 function txtClose () { if (document.f_frm.motive[5].checked) { document.f_frm.motive_add.disabled = false; } else { document.f_frm.motive_add.disabled = true; } } <form name="f_frm"> <input type="radio" name="motive" value="あ" onclick="txtClose();" />あ<br /> <input type="radio" name="motive" value="い" onclick="txtClose();" />い<br /> <input type="radio" name="motive" value="う" onclick="txtClose();" />う<br /> <input type="radio" name="motive" value="え" onclick="txtClose();" />え<br /> <input type="radio" name="motive" value="お" onclick="txtClose();" />お<br /> <input type="radio" name="motive" value="か" onclick="txtClose();" />か<br /> <input type="text" name="motive_add" size="20" maxlength="40" onclick="txtClose();" /> </form>
- ベストアンサー
- JavaScript
- ラジオボタンを選択したらテキストに数字入力
ラジオボタンを選択してvalueが1だったら、テキスト欄（Q1_TEXT）に0を入力し、それ以外だったら何もしない、というJavascriptを書きたいです。ラジオボタンによって、テキスト欄の有効化、無効化に関する書き方は見つけられたのですが、このような挙動について見つけることができませんでした。 ご存じの方がおられましたらご教示いただけますと助かります。 よろしくお願いいたします。 <body> <form> <INPUT type="radio" name="Q1" value="1"> <INPUT type="radio" name="Q1" value="2"> <INPUT type="radio" name="Q1" value="3"> <INPUT type="text" name="Q1_TEXT" value="_Q1_TEXT_CHK_" SIZE="7"> </form> </body>
- ベストアンサー
- JavaScript
お礼
すいません、ありがとうございます！ 再度、いじって動かせるよう努力してみます。 大変助かります。