データベースからデータを選択し、jspページで表示

Question

予約システムアプリケーションを作成しています。ユーザは、JSPページのテーブル内でコンサートや劇場などのアクティビティを見ることができます。しかし、私のコードは動作していません。データベースからデータを選択し、JSPページに表示したい。どうすれば克服できますか？私はコーディングするためにNetBeansを使用しています。データベースには、ID、タイプ、説明、都市、場所、日付が含まれます。

music.html

<form action="music.jsp"> 
<style type="text/css"> 


    .tg {border-collapse:collapse;border-spacing:0;margin:0px auto;} 
    .tg td{font-family:Arial, sans-serif;font-size:14px;padding:10px  5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;} 
    .tg th{font-family:Arial, sans-serif;font-size:14px;font-weight:normal;padding:10px 5px;border-style:solid;border-width:1px;overflow:hidden;word-break:normal;} 
    .tg .tg-yw4l{vertical-align:top} 
    th.tg-sort-header::-moz-selection { background:transparent; }th.tg-sort-header::selection  { background:transparent; }th.tg-sort-header { cursor:pointer; }table th.tg-sort-header:after { content:''; float:right; margin-top:7px; border-width:0 4px 4px; border-style:solid; border-color:#404040 transparent; visibility:hidden; }table th.tg-sort-header:hover:after { visibility:visible; }table th.tg-sort-desc:after,table th.tg-sort-asc:after,table th.tg-sort-asc:hover:after { visibility:visible; opacity:0.4; }table th.tg-sort-desc:after { border-bottom:none; border-width:4px 4px 0; }@media screen and (max-width: 767px) {.tg {width: auto !important;}.tg col {width: auto !important;}.tg-wrap {overflow-x: auto;-webkit-overflow-scrolling: touch;margin: auto 0px;}}</style> 
<div class="tg-wrap"><table id="tg-E98gw" class="tg"> 
     <tr> 
      <th class="tg-yw4l">ID</th> 
      <th class="tg-yw4l">Type</th> 
      <th class="tg-yw4l">Description</th> 
      <th class="tg-yw4l">City</th> 
      <th class="tg-yw4l">Location</th> 
      <th class="tg-031e">Date</th> 
     </tr> 
     <tr> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
     </tr> 
     <tr> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
     </tr> 
     <tr> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
     </tr> 
     <tr> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
      <td class="tg-yw4l"></td> 
     </tr> 
    </table></div> 
<script type="text/javascript" charset="utf-8">var TgTableSort = window.TgTableSort || function(n, t){"use strict"; function r(n, t){for (var e = [], o = n.childNodes, i = 0; i < o.length; ++i){var u = o[i]; if ("." == t.substring(0, 1)){var a = t.substring(1); f(u, a) && e.push(u)} else u.nodeName.toLowerCase() == t && e.push(u); var c = r(u, t); e = e.concat(c)}return e}function e(n, t){var e = [], o = r(n, "tr"); return o.forEach(function(n){var o = r(n, "td"); t >= 0 && t < o.length && e.push(o[t])}), e}function o(n){return n.textContent || n.innerText || ""}function i(n){return n.innerHTML || ""}function u(n, t){var r = e(n, t); return r.map(o)}function a(n, t){var r = e(n, t); return r.map(i)}function c(n){var t = n.className || ""; return t.match(/\S+/g) || []}function f(n, t){return - 1 != c(n).indexOf(t)}function s(n, t){f(n, t) || (n.className += " " + t)}function d(n, t){if (f(n, t)){var r = c(n), e = r.indexOf(t); r.splice(e, 1), n.className = r.join(" ")}}function v(n){d(n, L), d(n, E)}function l(n, t, e){r(n, "." + E).map(v), r(n, "." + L).map(v), e == T?s(t, E):s(t, L)}function g(n){return function(t, r){var e = n * t.str.localeCompare(r.str); return 0 == e && (e = t.index - r.index), e}}function h(n){return function(t, r){var e = + t.str, o = + r.str; return e == o?t.index - r.index:n * (e - o)}}function m(n, t, r){var e = u(n, t), o = e.map(function(n, t){return{str:n, index:t}}), i = e && - 1 == e.map(isNaN).indexOf(!0), a = i?h(r):g(r); return o.sort(a), o.map(function(n){return n.index})}function p(n, t, r, o){for (var i = f(o, E)?N:T, u = m(n, r, i), c = 0; t > c; ++c){var s = e(n, c), d = a(n, c); s.forEach(function(n, t){n.innerHTML = d[u[t]]})}l(n, o, i)}function x(n, t){var r = t.length; t.forEach(function(t, e){t.addEventListener("click", function(){p(n, r, e, t)}), s(t, "tg-sort-header")})}var T = 1, N = - 1, E = "tg-sort-asc", L = "tg-sort-desc"; return function(t){var e = n.getElementById(t), o = r(e, "tr"), i = o.length > 0?r(o[0], "td"):[]; 0 == i.length && (i = r(o[0], "th")); for (var u = 1; u < o.length; ++u){var a = r(o[u], "td"); if (a.length != i.length)return}x(e, i)}}(document); document.addEventListener("DOMContentLoaded", function(n){TgTableSort("tg-E98gw")});</script> 

music.jsp

Class.forName("org.apache.derby.jdbc.ClientDriver").newInstance(); 
    String url = "jdbc:derby://localhost:1527/users"; 
    String username = "users"; 
    String password = "123"; 
    String query = "select * from activities"; 
    Connection conn = DriverManager.getConnection(url, username, password); 
    Statement stmt = conn.createStatement(); 
    ResultSet rs = stmt.executeQuery(query); 
    while (rs.next()) { 



    <tr><td><%=rs.getInt("ID")%></td></tr> 
    <tr><td><%=rs.getString("Type")%></td></tr> 
    <tr><td><%=rs.getString("Description")%></td></tr> 
    <tr><td><%=rs.getString("City")%></td></tr> 
    <tr><td><%=rs.getString("Location")%></td></tr> 
    <tr><td><%=rs.getString("Date")%></td></tr> 
} 

Answer 1

music.jspは（私は、プロジェクトの構造を知らない、とあれば、2つのページがあると呼ばれていると仮定すると、同じフォルダ内など）、完全に新しいページを作成しています。その結果、music.htmlには決してデータが格納されません。したがって、アクションをサブミットすると、サーバーサイドでmusic.jspが呼び出され、コードが実行され、データが返され、完全に新しいHTMLページがサーバー側で生成され、ブラウザに返されます。 はまた、それはあなたが誤ってテーブルを作成しているように、あなたは例外を取得してください

<tr><td><%=rs.getInt("ID")%></td></tr>