- ベストアンサー
テキストボックスの中に順番に○がついていくような画面を表示できる方法
- jspで連続的に○が増える画面を表示する方法について質問です。
- ９個のテキストボックスがあり、OKボタンを押すたびに次のページに遷移し、１つずつ○が表示される仕組みを作りたいです。
- HTMLとJavaを組み合わせることで実現する方法を教えてください。
- Java
- 回答数3
- ありがとう数3
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
こんにちは。 >最初にindexを定義しておき、実際に表示する部分を書いて、・・・ そうですね、次に制御する為の値を隠し持っています。 >この部分などは、 >No.+<%=i+1%><%=input teyp="text" name="box" value=""%>・・・ >のようにappendを使用せず１行で書くことはできないでしょうか？ 書き方はいろいろあると思います。 この程度の文字列結合ではたいしたこと無いと思いますが、StringBufferを利用することにより処理速度の向上が望めます。 他の書き方の例としてはフォームタグの中に <form action="test.jsp" method="post"> <% for ( int i = 0; i < 9; i ++ ) { String value = ""; if ( i <= index ) { value = "○"; } %> No.<%= i + 1 %>:<input type="text" name="box" value="<%= value %>"><br> <% } %> <input type="hidden" name="ind" value="<%= index + 1 %>"> <input type="submit" VALUE="ok"> </form> こんな風にもかけます。 他にもまだまだいろいろ書き方はあります。 いろいろ試してみてください。
その他の回答 (2)
- LancerVII
- ベストアンサー率51% (1060/2054)
こんにちは。 hiddenは画面上には表示したくないけどパラメータに含めたい値を格納しておく感じでしょうか。 >画像にある各段階のものは"hidden"を使用したものなのでしょうか？ そうですね。現在表示している○のNo.を格納しています。 例： <input type="hidden" name="ind" value="1"> ここのvalueを増やしていくことによりどこまで○を表示するか制御しています。 ちなみに画像の動作は以下のjspで確認しました。 <%@ page contentType="text/html; charset=UTF-8" %> <% int index = -1; try { index = Integer.parseInt ( request.getParameter("ind") ); } catch ( Exception e ) { } if ( index >= 9 ) { index = -1; } StringBuffer sb = new StringBuffer(); String[] box = request.getParameterValues("box"); for ( int i = 0; i < 9; i ++ ) { sb.append ( "No." ); sb.append ( i + 1 ); sb.append ( ":<input type=\"text\" name=\"box\" value=\"" ); if ( i <= index ) { sb.append ( "○" ); } sb.append ( "\"><br>" ); } index ++; sb.append ( "<input type=\"hidden\" name=\"ind\" value=\"" ); sb.append ( index ); sb.append ( "\">" ); %> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>テスト</title> </head> <body> <form action="test.jsp" method="post"> <%= sb.toString() %> <input type="submit" VALUE="ok"> </form> </body> </html>
補足
ありがとうございます。 最初にindexを定義しておき、実際に表示する部分を書いて、次に実質の中身をhiddenにて隠しておきながら、indexを１ずつ増やしていっているという感じでよろしいでしょうか？ appendの存在も知らなかったので、調べてみると色んなケースで使用できそうですね。 しかし、 >sb.append ( "No." ); >sb.append ( i + 1 ); >sb.append ( ":<input type=\"text\" name=\"box\" value=\"" ); >if ( i <= index ) { >sb.append ( "○" ); この部分などは、 No.+<%=i+1%><%=input teyp="text" name="box" value=""%>・・・ のようにappendを使用せず１行で書くことはできないでしょうか？
- LancerVII
- ベストアンサー率51% (1060/2054)
こんにちは。 課題ということで答えをずばり書いてしまうと意味が無いのでヒントを出します。 方法はいろいろ考えられると思いますが、現在表示対象とする値をhiddenに含めるのが簡単かなと思います。 手順 1.現在の表示対象とする値をパラメータより取得する 2.<input・・・はループでNo.1～No.9まで生成する 3.2の生成時に表示対象となっている時はvalue="○"を出力する 4.現在の表示対象を加算してhidden値にセットする A.formのsubmit先は自分 課題ということで何か制限がある場合はそれに従ってくださいね。 他の方法としては <input type="text" name="box"> で10個定義すれば、request.getParameterValues("box"); でStringの配列として取得できます。 以上、頑張ってください。
補足
ご回答ありがとうございます。 遅れまして申し訳ありません。 "hidden"というものを使ったことがなくて、試してみましたがどのように使うのかがいまいちよくわかりません。 (どうゆう状況だからどのように"hidden"を使おうというのがピンときません。) 画像にある各段階のものは"hidden"を使用したものなのでしょうか？
お礼
こんにちは。 やはり色んな書き方があるんですね。 課題はrequestの他にも、session、bean、cookieで同様のものを作るようにと指示がありますので、ご回答いただいたコードを参考にやってみます。 ありがとうございました。
補足
こんにちは。 お礼した後で申し訳ありませんが、また宜しくお願いします。 同じものをsessionで試みておりますが、上手くいきません。 --------セッション１ページ目------------- <%@page language="java" %> <%@page contentType="text/html;charset=Shift_JIS" %> <% int index = -1; %> <HTML><HEAD><TITLE>追加課題１(session編)</TITLE> </HEAD><BODY> session<BR> <FORM ACTION="tuikakadai1.2.jsp" METHOD="post"> <% for(int i=0; i<9; i++){ String value=""; if(i<=index){ value="○"; } %> No.<%=i+1%><input type="text" name="box" value="<%=value%>"><BR> <%}%> <INPUT TYPE="submit" VALUE="ok"> </FORM> </BODY></HTML> ----------セッション２ページ目------------- <%@page language="java" %> <%@page contentType="text/html;charset=Shift_JIS" %> <% request.setCharacterEncoding("SHIFT_JIS"); String strBox=request.getParameter("box"); if(strBox!=null){ session.setAttribute("box",strBox); //int index++; %> <HTML><HEAD><TITLE>追加課題１(session編)</TITLE> </HEAD><BODY> session<BR> <FORM ACTION="tuikakadai1.3.jsp" METHOD="post"> <% //for(int i=0; i<9; i++){ // String value=""; // if(i<=index){ // value="○"; //} %> <%=session.getAttribute("box")%><BR> //<%}%> <INPUT TYPE="submit" VALUE="ok"> </FORM> </BODY></HTML> 以上になります。 １ページ目はきちんと表示されますが、２ページ目が「OK」のボタンのみになってしまいます。 １ページ目のループさせているテキストボックスはそのまま「box」として２ページ目以降でも使用できるのでしょうか？ 再度、宜しくお願いします。