HTMLページからJSPページへの受け渡し方法とテーブルの行の繰り返しについて

このQ&Aのポイント
  • この質問は、HTMLページでスポーツ種目を選択し、JSPページで種目名・料金・画像を表示する方法についてのものです。
  • テーブルに入れる方法やテーブルの行の繰り返しが上手くできないため、配列を使用したが画像が正しく表示されていない。
  • 質問は、修正可能な箇所が限られているが、修正方法や対処方法を知りたい。
回答を見る
  • ベストアンサー

htmlページからjspページへの受け渡し

htmlページでスポーツ種目を選びjspページで種目名・料金・画像を表示するものですが tableに入れる方法やテーブルの行の繰り返しが上手く出来ません 配列を使ってはみましたが、画像が正しく表示できていません ※修正できる箇所は限られています htmlページ <html> <head> <title></title> </head> <body> <div align="center"> <h1>参加スポーツの選択</h1> <form action="jspFormexam2.jsp" method="get"> <table border="1" bgcolor="white"> <tr bgcolor="#00FFFF"> <td colspan="4"> スポーツを選択してください </td> </tr> <tr> <td><img src="img/banana.jpg" height="100" width="166"></td> <td>バナナボート</td> <td> <input type="checkbox" name="tour" value="0"> </td> <td>$30</td> </tr> <tr> <td><img src="img/para.jpg" height="100" width="166"></td> <td>パラグライダー</td> <td> <input type="checkbox" name="tour" value="1"> </td> <td>$45</td> </tr> <tr> <td><img src="img/surfing.jpg" height="100" width="166"></td> <td>サーフィン</td> <td> <input type="checkbox" name="tour" value="2"> </td> <td>$20</td> </tr> <tr> <td><img src="img/dive.jpg" height="100" width="166"></td> <td>ダイビング</td> <td> <input type="checkbox" name="tour" value="3"> </td> <td>$100</td> </tr> <tr> <td><img src="img/golf.jpg" height="100" width="166"></td> <td>ゴルフ</td> <td> <input type="checkbox" name="tour" value="4"> </td> <td>$70</td> </tr> <tr> <td colspan="2">参加人数</td> <td><input type="text" name="people" size="4"></td> </tr> </table> <input type="submit" value="送信"> <input type="reset" value="リセット"> </form> <h2>5人以上で10%off</h2> </div> </body> </html> jspページ <%@ page contentType="text/html;charset=Shift_JIS"%> <% request.setCharacterEncoding("Shift_JIS"); int[] tourPrice = {30,45,20,100,70}; String[] tourName ={"バナナボート","パラセイリング","サーフィン","ダイビング","ゴルフ"}; String[] tourImg ={"banana.jpg","para.jpg","surfing.jpg","dive.jpg","golf.jpg"}; int total =0; int itemprice =0; String tableData ="<tr bgcolor='#00FFFF'><th>ツアー名</th>"+"<th>単価</th><th>合計</th><th>イメージ</th></tr>"; String message =""; String subject =""; 修正可能箇所↓ String[ ] tourValues=request.getParameterValues("tour"); for(int i=0; i<tourValues.length; i++){ <%=tourPrice[i] %> <%=tourName[i] %> <%=tourImg[i] %> <% } %> 修正可能箇所↑ <html> <head> <title>マリンスポーツ申し込み明細</title> </head> <body> <div align="center"> <h1 align ="center"><%= subject %></h1> <hr> <table border ="1"> <%= tableData %> </table><br> <%=message %> <hr> </div> </body> </html>

  • Java
  • 回答数2
  • ありがとう数1

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

  • ベストアンサー
noname#177743
noname#177743
回答No.2

修正箇所だけでつじつまを合わせるわけですね。 そもそもテーブルの表示は、<%= tableData %>となっているわけで、すべてtableDataにまとめて表示する考え方のようですから、<%=tourPrice[i] %>とかやって書きだしてはダメでしょう。それから、やみくもに配列から値を取り出して書きだそうとしてもダメです。「どのチェックがONなのか」を調べ、その値を配列から取り出すようにしないといけません。 まぁ、こんな感じでしょうか。 String[] tourValues=request.getParameterValues("tour"); if (tourValues != null){ for(int i=0; i < tourValues.length; i++){ try { int val = Integer.parseInt(tourValues[i]); tableData += "<tr><td>" + tourName[val] + "</td><td>" + tourPrice[val] + "</td><td>" + "**合計って何?**" + "</td><td><img src=\"" + tourImg[val] + "\"></td></tr>"; } catch(NumberFormatException e){} } } 合計ってのがなんだかわからないので抜かしてあります。そのへんは自分で処理を考えてください。 もうちょっとデータの扱い方を整理できるといいですね。

setykyan
質問者

お礼

遅くなってすみません 回答を参考にして無事解決できました ありがとうございます

その他の回答 (1)

  • teketon
  • ベストアンサー率65% (141/215)
回答No.1

致命的にJSPを勘違いしています。そして、なぜJSPを使用しているのかもわかりません。 薄い本でもいいので、基礎を勉強したほうが良いです。

関連するQ&A

  • jsp 通販サイト作成での質問

    jspを使い通販サイトを作成しています 「session.jsp」では商品の選択をし選んだ商品をsessionを用いて 次のページの「cart.jsp」で表示するというものなのですが 「session.jsp」の下部で、カートに入れる のボタンを押した数に応じて 選んだ商品の数を表示するものを作ったのですが上手くカウントできていません size()を使い商品数を表示したいのですが上手くいきません どなたかよろしくお願いします <%@ page contentType="text/html;charset=Shift_JIS"%> <%@ page import= "java.util.ArrayList" %> <%@ page session="true" %> <% request.setCharacterEncoding("Shift_JIS"); String[] Price = {"4000","2500","500","3000","1500"}; String[] Name ={"たらばがに","毛ガニ","いか","うに","あわび"}; String[] Img ={"taraba.gif","ke.gif","ika.gif","uni.gif","awabi.gif"}; String message =""; String abc =""; String selectValues=request.getParameter("select"); String[] array=new String[3]; if(selectValues !=null){ array[0]=Name[Integer.parseInt(selectValues)]; array[1]=Price[Integer.parseInt(selectValues)]; array[2]=Img[Integer.parseInt(selectValues)]; ArrayList<String> i = new ArrayList<String>(); i.add(selectValues); //ここが問題点です abc="かごの中身は"+i.size()+"個です"; }else{ abc="商品を入れてください"; } %> <center><h1>海産物ショッピング</h1></center> <html> <head> <title>海産物ショッピング</title> </head> <body> <div align="center"> <hr> <form action="session.jsp"> <table border ="1"> <tr><th>たらばがに</th><th><img src="img/taraba.gif"></img></td></th><td>¥4000円<input type ="hidden" name=select value="0"><input type="submit" name=keyword value="カートに入れる"></input></td> </form> <form action="session.jsp"> </tr><tr><th>毛ガニ</th><th><img src="img/ke.gif"></img></td></th><td>¥2500円<input type ="hidden" name=select value="1"><input type="submit" name=keyword value="カートに入れる"></td></tr> <tr><th>いか</th><th><img src="img/ika.gif"></img></td></th><td>¥500円<input type ="hidden" name=select value="2"><input type="submit" name=keyword value=" カートに入れる"></td></tr> <tr><th>うに</th><th><img src="img/uni.gif"></img></td></th><td>¥3000円<input type ="hidden" name=select value="3"><input type="submit" name=keyword value="カートに入れる"></td></tr> <tr><th>あわび</th><th><img src="img/awabi.gif"></img></td></th><td>¥1500円<input type ="hidden" name=select value="4"><input type="submit" name=keyword value="カートに入れる"></td></tr> </table><br> </form> <table border ="1"> </table><br> <%=message %> <%=abc %> <hr> </div> </body> </html>

    • ベストアンサー
    • Java
  • 助けてください><IE上で1pxのズレ

    こんにちわ。 組んだテーブルに謎の1pxがはいってしまいます。 ファイヤーフォックスでは正常なのですがIEでは1pxの隙間ができてしまうようで。 どなたか分かる方いらっしゃたらお願いします>< <table width="660" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="2" valign="top"> <img src="img/test_01.jpg" width="660" height="177" alt=""></td> </tr> <tr><td rowspan="2" valign="top"> <table width="316" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="2"> <img src="img/test_02.jpg" width="316" height="46" alt=""></td> </tr> <tr> <td> <img src="img/test_05.jpg" width="144" height="47" alt=""></td> <td> <img src="img/test_06.jpg" width="172" height="47" alt=""></td> </tr> <tr> <td colspan="2"> <img src="img/test_08.jpg" width="316" height="169" alt=""></td> </tr> </table> </td></tr> <tr><td valign="top"> <table width="344" border="0" cellpadding="0" cellspacing="0"> <tr><td> <table width="344" border="0" cellpadding="0" cellspacing="0"> <tr> <td> <img src="img/test_03.jpg" width="181" height="62" alt=""></td> <td> <img src="img/test_04.jpg" width="163" height="62" alt=""></td> </tr> <tr> <td colspan="2"> <img src="img/test_07.jpg" width="344" height="83" alt=""></td> </tr> </table> </td></tr> <tr><td> <table width="344" border="0" cellpadding="0" cellspacing="0"> <tr> <td> <img src="img/test_09.jpg" width="160" height="62" alt=""></td> <td> <img src="img/test_10.jpg" width="184" height="62" alt=""></td> </tr> <tr> <td colspan="2"> <img src="img/test_11.jpg" width="344" height="23" alt=""></td> </tr> <tr> <td> <img src="img/test_12.jpg" width="160" height="32" alt=""></td> <td> <img src="img/test_13.jpg" width="184" height="32" alt=""></td> </tr> </table> </td></tr> </table> </td></tr> <tr><td colspan="2"> <table width="660" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="5"> <img src="img/test_14.jpg" width="660" height="141" alt=""></td> </tr> <tr> <td> <img src="img/test_15.jpg" width="130" height="150" alt=""></td> <td> <img src="img/test_16.jpg" width="130" height="150" alt=""></td> <td> <img src="img/test_17.jpg" width="140" height="150" alt=""></td> <td> <img src="img/test_18.jpg" width="130" height="150" alt=""></td> <td> <img src="img/test_19.jpg" width="130" height="150" alt=""></td> </tr> <tr> <td colspan="5"> <img src="img/test_20.jpg" width="660" height="40" alt=""></td> </tr> </table> </td></tr> </table>

  • ゲームの宣伝掲示板に非アクティブで連続投稿がしたい

    ゲームの宣伝掲示板があるのですが、流れが速く自動的に連続投稿をしたいのですが、できたら非アクティブにしたいのです。 で、UWSCのソフトを使ってCOMコンポーネントを使って IE.visible = FALSE にして見えなくすれば作業の邪魔にならないかと考えたのですが、 <input type="hidden" name="name" value="××××"> <input type="hidden" name="island" value="××××"> <textarea name="message" cols="75" rows="7"></textarea> </td> </tr> </table> <table width="554" border="0" cellspacing="0" cellpadding="0" align="center"> <tr><td colspan="2" height="8"></td></tr> <tr> <td width="31"><input type="image" name="ok[]" alt="送信" src="img/btn_ok.gif"></td> <td width="28"> <div align="center"><img src="img/img_or.gif" width="19" height="16"></div> </td> <td width="31"><input type="image" name="no[]" alt="リセット" src="img/btn_no.gif"></td> のhtmlの<textarea>は IE.document.forms[0].elements[2].value ="×××××" で、無事入力できたのですが、 <input type="image" name="no[]" alt="リセット" src="img/btn_no.gif"> で、 IE.document.forms[0].elements[3].click() では、COMエラーが出てしまいます。input type="image"はclickは効かないのでしょうか? 入力できる手立てはないでしょうか?

  • IE6でレイアウトが崩れてしまいます

    制作しているWebサイトでIE6でプレビューした時のみ中央に配置したページが左にずれてしまいます。 ただし、他のページは中央に表示されていて、メールフォームを入れているページだけが左に表示されてしまいます。 ということから、スタイルシートの問題というよりは、formタグやレイアウトテーブルの置き方の問題なのだろうと思うのですが、助言をいただけないでしょうか。よろしくお願いいたします。 ソースは以下の通りです。 -------------------------------------- <form action="./clipmail.cgi" method="post" enctype="multipart/form-data"> <input type="hidden" name="need" value="姓 名" /> <input type="hidden" name="match" value="メール メール確認" /> <table border="0" cellpadding="5" align="center" width="80%"> <tr> <td><img src="images/l_name.gif" alt="ご氏名" width="70" height="21" /></td> <td> 姓(全角) <input type="text" name="姓" size="12" />   名(全角) <input type="text" name="名" size="12" />(必須)</td> </tr> <tr> <td><img src="images/l_name2.gif" alt="ご氏名(かな)" width="125" height="21" /></td> <td>せい(全角) <input type="text" name="せい" size="12" />  めい(全角) <input type="text" name="めい" size="12" />(必須)</td> </tr> <tr> <td><img src="images/l_age.gif" alt="年代" width="54" height="21" /></td> <td><label> <select name="年代"> <option value="" selected="selected"></option> <option value="~19歳">~19歳</option> <option value="20~29歳">20~29歳</option> <option value="30~39歳">30~39歳</option> <option value="40~49歳">40~49歳</option> <option value="50~59歳">50~59歳</option> <option value="60~69歳">60~69歳</option> <option value="70歳~">70歳~</option> </select>(必須)</label></td> </tr> <tr> <td><img src="images/l_mail.gif" alt="メールアドレス" width="135" height="21" /></td> <td><input type="text" name="メール" size="50" />(必須)</td> </tr> <tr> <td><img src="images/l_mailconfirm.gif" alt="メールアドレス確認" width="167" height="21" /></td> <td><input type="text" name="メール確認" size="50" />(再度入力)</td> </tr> <tr> <td><img src="images/l_reply.gif" alt="ご希望時間帯" width="182" height="21" /></td> <td><select name="ご希望時間帯"> <option value="時間指定なし" selected="selected">時間指定なし</option> <option value="午前">午前</option> <option value="午後">午後</option> <option value="18時以降">18時以降</option> <option value="土曜日">土曜日</option> <option value="日曜、祝祭日">日曜、祝祭日</option> </select> (必須)</td> </tr> <tr> <td><img src="images/l_consult.gif" alt="ご相談内容" width="103" height="21" /></td> <td><textarea name="ご相談内容" rows="10" cols="60"></textarea></td> </tr> <tr> <td colspan="2"><img src="../common/images/spacer.gif" width="1" height="10" /></td> </tr> <tr> <td colspan="2" align="center"> <input type="submit" value="入力内容を確認する" /><img src="../common/images/spacer.gif" height="10px" width="20px" /><input type="reset" value="すべて書き直す" /></td> </tr> </table> </form> と、こんな感じです。 ちなみに、これを囲んでいる<div id="container">は外部スタイルシートで #container { margin: 0 auto; width: 800px; } としています。 ページのトップで使用しているイメージが最大幅800pxで、背景に幅800pxの画像を使い、コンテナが中央に来るように配置しています。 どうぞよろしくお願いいたします。

  • JavaScriptを入れるとtdタグ内の高さが広がる

    CSSにて高さ指定もしてあるのですが、JavaScriptの記載あるtdタグの高さがIEだと広がってしまいます。 この現象はFireFoxだと現れません。 下記コードですと3段目と4段目のtdの高さが他の段に比べ広がってしまいます。 何か解決策とうございましたら、教えてください。 -----------JavaScript関数----------- <script language="javascript"> function goNext() {  if (confirm("確認")) {   return true;  } else {   return false;  } } </script> -----------html----------- <table id="tablea"> <tr><td class="b"><img src="img.jpg"/></td></tr> <tr><td>&nbsp;</td></tr> <tr><td class="b"><form action="5_4modify1_pla.html" onsubmit="return goNext();"><input name="bb" type="image" src="img.jpg" width="150" height="30"/></form></td></tr> <tr><td class="b"><form action="5_4modify1_pla.html" onsubmit="return goNext();"><input name="bb" type="image" src="img.jpg" width="150" height="30"/></form></td></tr>  <tr><td class="b"><img src="img.jpg"/></td></tr> </table> -----------CSS----------- .b {height: 30px;} #tablea { width: 180px; height: 200px;} ----------------------

    • ベストアンサー
    • HTML
  • チェックボックスのチェック処理

    HTMLでボタン押下時にチェックしたいことがあります。 ■カテゴリーA~Cで、カテゴリー毎に選択できるのは一つのみ  (例)「A1・あ」と「A2・お」が選択時はNG ■カテゴリーは最大2つまで選択可能  (例)「A1・い」と「C1・さ」が選択時はOK    「A1・い」と「B2・く」と「C1・さ」が選択時はNG <html> <head> </head><body> <form> <table border="1"> <tr> <td>A1</td> <td><input type="checkbox" name="chk1" value="1">あ</td> </tr> <tr> <td> </td> <td><input type="checkbox" name="chk1" value="1">い</td> </tr> <tr> <td> </td> <td><input type="checkbox" name="chk1" value="1">う</td> </tr> <tr> <td>A2</td> <td><input type="checkbox" name="chk1" value="1">え</td> </tr> <tr> <td> </td> <td><input type="checkbox" name="chk1" value="1">お</td> </tr> <tr> <td>B1</td> <td><input type="checkbox" name="chk1" value="1">か</td> </tr> <tr> <td>B2</td> <td><input type="checkbox" name="chk1" value="1">く</td> </tr> <tr> <td> </td> <td><input type="checkbox" name="chk1" value="1">け</td> </tr> <tr> <td>C1</td> <td><input type="checkbox" name="chk1" value="1">さ</td> </tr> <tr> <td>C2</td> <td><input type="checkbox" name="chk1" value="1">し</td> </tr> <tr> <td> </td> <td><input type="checkbox" name="chk1" value="1">す</td> </tr> </table> <input type="submit" value="チェック"> </form> </body> </html> すみませんがよろしくお願いします。

  • HTML CSS 表示画像のサイズ

    表示画像のサイズについて。元の画像サイズはばらばらです。 初歩的な質問ですがよろしくお願いします。 <tr> <td><img src="images/A.jpg" width="100" height="100" border="2"></td> <td>コメント</td> </tr> <tr> <td><img src="images/B.jpg" width="100" height="100" border="2"></td> <td>コメント</td> </tr> <tr> <td><img src="images/C焼.jpg" width="100" height="100" border="2"></td> <td>コメント</td> </tr> これをCSSで書く場合なのですが、 img{   width:100 height:100 border:2 } としたのですが、うまくいきません。なぜでしょうか?

    • ベストアンサー
    • HTML
  • ページ上部にスペースが空いてしまう・・・

    今ショッピングモールに出店するために素人ながらページを作っているんですが、ヘッダーの部分の上にスペースがどうしても空いてしまっていていて、修復できません・・・・。モールの方に聞いてみたところ「閉じるタグが抜けている・・」等の答えが返ってきたのですが、それ以上は教えてくれませんでした。。いろいろ調べてみたのですが、どうしても分かりません。。どうかよろしくお願いいたします。 ↓まだ作成途中なので変な箇所があるかもしれません・・。 <table class="head" bouder> <tr> <td class="head"> <img src="gazou" width=600 height=130 alt=""> <tr> <tr align="right"valign="middle"><br> <tr> <td width="713" height="35"> <table width="0" border="0" cellpadding="0"> <tr><td width="32%"><img src="gazou" width="200" height="8"></td> <td width="0%"><a href="~.html"><img src="gazou" width="108" height="25"border="0"></td> <td width="16%"><a href="~html"><img src="gazou" width="107" height="27"border="0"></td> <td width="16%"><a href="~html"><img src="/lib/shidagoromo/puraa" width="108" height="27"border="0"></td> <td width="16%"><a href="~.html"><img src="gazou" width="107" height="27" border="0"></td> <td width="20%"><img src="gazou" width="107" height="28"border="0"></td> </tr> </table> </td> </tr> よろしくお願いします。

    • ベストアンサー
    • HTML
  • JSPにおける引数の受け渡し

    こんにちは. 今JSPのプログラムを作っているのですが,引数を送る場面で困っています. test2.jspにおいて,タイプはちゃんと表示されているのですが,IDとパスワードはnullになっています. もし宜しければ,どこが間違っているのかお教えいただけないでしょうか?よろしくお願いします. 【test.jsp】 ~省略~ <%String type="aaa";%> <?xml version="1.0" encoding="Shift-JIS" ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja"> <head> ~省略~ </head> <body> <div class="abc"> <h1>タイトル</h1> <form action="test2.jsp" method="post"> <p> <table> <tr> <td>ID</td> <td><input type="text" name="user_id" /></td> </tr> <tr> <td>パスワード</td> <td><input type="password" name="user_pass" /></td> </tr> </table> <br /> <input type="button" value="ログイン" onclick="test('test2.jsp?type=<%=type%>')" /> </p> </form> </div> <script type="text/javascript" src="test.js"></script> </body> </html> 【test2.jsp】 ~省略~ <% String type=request.getParameter("type"); String user_id=request.getParameter("user_id"); String user_pass=request.getParameter("user_pass"); %> ~省略~ <h1>タイトル2</h1> <p> <table> <tr> <td>ID</td> <td><%=user_id%></td> </tr> <tr> <td>パスワード</td> <td><%=user_pass%></td> </tr> <tr> <td>タイプ</td> <td><%=type%></td> </tr> </table> </p>

    • ベストアンサー
    • HTML
  • テーブルで画像を並べるときに・・

    今ホームページをつくっていて 幅600pxのロゴ(jpg画像)の下に幅280px,80px,80px,80px,80px画像を並べています。 全部の画像をぴったりくっつけたいんですが、上のロゴと下の5つ並んだ画像の間に1pxくらいの隙間が出来てしまいます。 ソースは <table width="600" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="5"> <img src="img/title.jpg" width="600" border="0"> </td> </tr> <tr> <td> <img src="img/1.jpg" width="280"height="35" border="0"> </td> <td> <img src="img/2.jpg" width="80" height="35" border="0"> </td> <td> <img src="img/3.jpg" width="80" height="35" border="0"> </td> <td> <img src="img/4.jpg" width="80" height="35" border="0"> </td> <td> <img src="img/5.jpg" width="80" height="35" border="0"> </td> </tr> </table> http://web-channel.com/index.html このホームページのようにしたいんですがどこを直したらいいんでしょうか? 環境は、WinMEでエディタにタグ打ち込んで作ってます。

    • ベストアンサー
    • HTML

専門家に質問してみよう