问题：

使用JSP、Java和Javascript的带有数据库数据的超文本标记语言表

越雨泽

2023-03-14

简介：我必须在没有任何框架或外部库的帮助下，使用JSP、Java、Javascript和JQuery为大学课程创建一个webapp。在这个webapp中，我们必须实现一个类似日历的表格，它显示您的课程，存储在数据库中。因此，我创建了一个包含许多单元格的表，每个单元格都有自己的id，几乎每个单元格都有自己的onclick处理程序，它将您引导到一个页面，您可以在该页面中创建/编辑或删除课程。

问题：我无法在此表中显示存储在数据库中的值，因为我有一个java的ResultSet，我无法使用javascript来编辑单元格。

注意：我知道这不是一种好的编程风格，但这不是重点。它只需要工作，就这样。

Java部分：

<%@ page import="java.sql.*"%>
<%@ page import="javax.sql.*"%>
<%@ page import="java.util.*" %>
<%
//Establishing Connection to DB
Class.forName("com.mysql.jdbc.Driver");
java.sql.Connection con = DriverManager.getConnection("jdbc:mysql://localhost:3306/mysql","root","123456");
Statement st= con.createStatement();
/*=======================================================================
Getting Data for td's - This is The Problematic Section
=======================================================================*/
 ResultSet rs1 = st.executeQuery("SELECT * FROM Termine");
 List<String[]> list1 = new ArrayList();
 List<String[]> list2 = new ArrayList();
 while(rs1.next()){
    String veranName = rs1.getString(1);
    String terminid = rs1.getString(2); 
    list1.add(new String[]{veranName});
    list2.add(new String[]{terminid});
}

身体部分：

<body onload="insertIntoTable()">
<table border="1" style="width:100%" id="t01">
<tr id="00">
    <th>Uhrzeit</th> //Time
    <th>Montag</th>  //Monday
    <th>Dienstag</th> //...
    <th>Mittwoch</th>
    <th>Donnerstag</th>
    <th>Freitag</th>
    <th>Samstag</th>  //...
    <th>Sonntag</th> //Sunday
</tr>

<tr id="07">
    <td>07:00</td> //this is not supposed to be clickable
    <td id="mo07" onclick="go(this)"> </td> //this id means monday 07:00
    <td id="di07" onclick="go(this)"> </td>
    <td id="mi07" onclick="go(this)"> </td>
    <td id="do07" onclick="go(this)"> </td>
    <td id="fr07" onclick="go(this)"> </td>
    <td id="sa07" onclick="go(this)"> </td>
    <td id="so07" onclick="go(this)"> </td>
</tr>

<tr id="08">
    <td>08:00</td>
    <td id="mo08" onclick="go(this)"> </td>
    <td id="di08" onclick="go(this)"> </td>
    <td id="mi08" onclick="go(this)"> </td>
    <td id="do08" onclick="go(this)"> </td>
    <td id="fr08" onclick="go(this)"> </td>
    <td id="sa08" onclick="go(this)"> </td>
    <td id="so08" onclick="go(this)"> </td>

</tr>
<tr id="09">
    <td>09:00</td>
    <td id="mo09" onclick="go(this)"> </td>
    <td id="di09" onclick="go(this)"> </td>
    <td id="mi09" onclick="go(this)"> </td>
    <td id="do09" onclick="go(this)"> </td>
    <td id="fr09" onclick="go(this)"> </td>
    <td id="sa09" onclick="go(this)"> </td>
    <td id="so09" onclick="go(this)"> </td>
</tr>
<tr id="10">
    <td>10:00</td>
    <td id="mo10" onclick="go(this)"> </td>
    <td id="di10" onclick="go(this)"> </td>
    <td id="mi10" onclick="go(this)"> </td>
    <td id="do10" onclick="go(this)"> </td>
    <td id="fr10" onclick="go(this)"> </td>
    <td id="sa10" onclick="go(this)"> </td>
    <td id="so10" onclick="go(this)"> </td>
</tr>
<tr id="11">
    <td>11:00</td>
    <td id="mo11" onclick="go(this)"> </td>
    <td id="di11" onclick="go(this)"> </td>
    <td id="mi11" onclick="go(this)"> </td>
    <td id="do11" onclick="go(this)"> </td>
    <td id="fr11" onclick="go(this)"> </td>
    <td id="sa11" onclick="go(this)"> </td>
    <td id="so11" onclick="go(this)"> </td>
</tr>
<tr id="12"> 
    <td>12:00</td>
    <td id="mo12" onclick="go(this)"> </td>
    <td id="di12" onclick="go(this)"> </td>
    <td id="mi12" onclick="go(this)"> </td>
    <td id="do12" onclick="go(this)"> </td>
    <td id="fr12" onclick="go(this)"> </td>
    <td id="sa12" onclick="go(this)"> </td>
    <td id="so12" onclick="go(this)"> </td>
</tr>
<tr id="13">
    <td>13:00</td>
    <td id="mo13" onclick="go(this)"> </td>
    <td id="di13" onclick="go(this)"> </td>
    <td id="mi13" onclick="go(this)"> </td>
    <td id="do13" onclick="go(this)"> </td>
    <td id="fr13" onclick="go(this)"> </td>
    <td id="sa13" onclick="go(this)"> </td>
    <td id="so13" onclick="go(this)"> </td>
</tr>
<tr id="14">
    <td>14:00</td>
    <td id="mo14" onclick="go(this)"> </td>
    <td id="di14" onclick="go(this)"> </td>
    <td id="mi14" onclick="go(this)"> </td>
    <td id="do14" onclick="go(this)"> </td>
    <td id="fr14" onclick="go(this)"> </td>
    <td id="sa14" onclick="go(this)"> </td>
    <td id="so14" onclick="go(this)"> </td>
</tr>
<tr id="15">
    <td>15:00</td>
    <td id="mo15" onclick="go(this)"> </td>
    <td id="di15" onclick="go(this)"> </td>
    <td id="mi15" onclick="go(this)"> </td>
    <td id="do15" onclick="go(this)"> </td>
    <td id="fr15" onclick="go(this)"> </td>
    <td id="sa15" onclick="go(this)"> </td>
    <td id="so15" onclick="go(this)"> </td>
</tr>
<tr id="16">
    <td>16:00</td>
    <td id="mo16" onclick="go(this)"> </td>
    <td id="di16" onclick="go(this)"> </td>
    <td id="mi16" onclick="go(this)"> </td>
    <td id="do16" onclick="go(this)"> </td>
    <td id="fr16" onclick="go(this)"> </td>
    <td id="sa16" onclick="go(this)"> </td>
    <td id="so16" onclick="go(this)"> </td>
</tr>
<tr id="17">
    <td>17:00</td>
    <td id="mo17" onclick="go(this)"> </td>
    <td id="di17" onclick="go(this)"> </td>
    <td id="mi17" onclick="go(this)"> </td>
    <td id="do17" onclick="go(this)"> </td>
    <td id="fr17" onclick="go(this)"> </td>
    <td id="sa17" onclick="go(this)"> </td>
    <td id="so17" onclick="go(this)"> </td>
</tr>
<tr id="18">
    <td>18:00</td>
    <td id="mo18" onclick="go(this)"> </td>
    <td id="di18" onclick="go(this)"> </td>
    <td id="mi18" onclick="go(this)"> </td>
    <td id="do18" onclick="go(this)"> </td>
    <td id="fr18" onclick="go(this)"> </td>
    <td id="sa18" onclick="go(this)"> </td>
    <td id="so18" onclick="go(this)"> </td>
</tr>
<tr id="19">
    <td>19:00</td>
    <td id="mo19" onclick="go(this)"> </td>
    <td id="di19" onclick="go(this)"> </td>
    <td id="mi19" onclick="go(this)"> </td>
    <td id="do19" onclick="go(this)"> </td>
    <td id="fr19" onclick="go(this)"> </td>
    <td id="sa19" onclick="go(this)"> </td>
    <td id="so19" onclick="go(this)"> </td>
</tr>
<tr id="20">
    <td>20:00</td>
    <td id="mo20" onclick="go(this)"> </td>
    <td id="di20" onclick="go(this)"> </td>
    <td id="mi20" onclick="go(this)"> </td>
    <td id="do20" onclick="go(this)"> </td>
    <td id="fr20" onclick="go(this)"> </td>
    <td id="sa20" onclick="go(this)"> </td>
    <td id="so20" onclick="go(this)"> </td>
</tr>
<tr id="21">
    <td>21:00</td>
    <td id="mo21" onclick="go(this)"> </td>
    <td id="di21" onclick="go(this)"> </td>
    <td id="mi21" onclick="go(this)"> </td>
    <td id="do21" onclick="go(this)"> </td>
    <td id="fr21" onclick="go(this)"> </td>
    <td id="sa21" onclick="go(this)"> </td>
    <td id="so21" onclick="go(this)"> </td>
</tr>
</table>

<button onclick="drucken()">Drucken</button>
<button onclick="logout()" style="float: right;">Logout</button>

脚本部分：

<script>
/*========================================================================
other Part of the Problem
======================================================================*/
function insertIntoTable(){

var idArray = [<% for (int i = 0; i < list1.size(); i++){%>"<%= list1.get(i) %>"<%= i + 1 < list1.size() ? ",":"" %><% } %>];

var nameArray = [<% for (int i = 0; i < list2.size(); i++){%>"<%= list2.get(i) %>"<%= i + 1 < list2.size() ? ",":"" %><% } %>];

var len = idArray.length;

for (index = 0; index < len; index=index+1){
    var vname = idArray[index];
    var vid = nameArray[index];
    document.getElementById(vid).value=vname;
   }
}
</script>

My试图解决这个问题：因此我尝试将ResultSet放入ArrayList并将其转换为Javascript数组，以多种方式更新表。我还试着用另一种方式来实现它，但也没有成功。我正在努力解决这个问题，现在超过7个小时。。。

问题：如何解决这个问题？还有更优雅的方法吗？

谢谢你的帮助和时间。

共有1个答案

皇甫夕

2023-03-14

（好的，我现在有时间更深入地看一下。）

首先在list1和list2中检查您的数据插入！

我不确定您是否知道如何将内容放入列表中，而您可以看到您使用字符串数组，即listx。添加（新字符串[]{…}）。字符串[]表示您使用数组。因此，当您稍后进行java/javascript混合时，您不会在代码中考虑这一点。(?)

因此，我用硬记录数据在本地模拟了db部分，如：

list1.add(new String[]{"free", "math", "zzz", "programming", "java", "free", "free"});
list2.add(new String[]{"mo07", "di07", "mi07", "do07", "fr07", "sa07", "so07"});

我只是想保持逻辑尽可能与你的相似，很少修改。

第二，我修改了javascript

现在请注意，我替换了。带有的值。innerHTML这是在TD标记中添加文本的正确方法。

function insertIntoTable(){
var idArray = <%= (Arrays.toString(list1.get(0))).replace("[", "['").replace(", ","', '").replace("]","']") %>;
var nameArray = <%= (Arrays.toString(list2.get(0))).replace("[", "['").replace(", ","', '").replace("]","']") %>;
var len = idArray.length;
for (index = 0; index < len; index=index+1){
    var vname = idArray[index];
    var vid = nameArray[index];
    document.getElementById(vid).innerHTML = vname;
   }
}

另请参见我将字符串[]数组“编码”为javascript，并将[和，符号替换为“惰性”。只需将其包装为”（引号），以便javascript可以将其理解为数组。

祝其他人好运。（关于解决这一问题的优雅方法，确实有。但我认为，对于您来说，只需按照您到目前为止所做的来学习。所有步骤都是由学习者制定的，都有利于学习。。正如我在前面的评论中所写的，我会让java进行输出和表生成。因为硬编码无法赢得整个表并给出数据a到javascript只是为了填充td文本。有时向javascript提供数据（来自java）是很好的。在这种情况下，您需要对每个客户端进行快速逻辑或进行一些计算等，但在您的情况下，我看不到（和利润）

类似资料：

数据不会从超文本标记语言表单传递到数据库

我是PHP新手，不知道自己做错了什么。我可以打开html表单并提供数据，但当我点击submit时，它会显示php代码，并且数据库（显然）没有更新。我已经尝试过通过phpMyAdmin手动将值插入表中，并且效果很好。我在网上看过，但我的语法看起来不错。我做错什么了吗？如果错误不太明显，是否有有效的调试方法（即查看错误）？我有超文本标记语言代码这是PHP代码这张表位于phpMyAdmin的数据库
数据表-返回列作为超文本标记语言元素

我在将一些客户端数据表逻辑迁移到服务器端时遇到了一些困难。我当前的问题是，对于Datatables，如果要对一大组数据（20000行）进行分页，我首先需要加载控制器中的所有行，然后将它们传递给视图：然后，在加载所有内容和Datatables将记录分页为500页之前，需要等待大约2分钟：我更改了Datatables声明，以通过处理服务器端处理，如下所示：让它按我所希望的方式工作非常顺利，但问
使用JSoup的超文本标记语言解析

我是新来的。我想解析html，但问题是我们必须在中指定的URL，我将在运行时从其他页面响应此URL。有没有办法将收到的网址传递到中？我读过这样的东西：但是我不知道如何使用它。我很想知道是否有其他方法比jsoup更好。
Struts 2-Tile-带有超文本标记语言Anchor的结果

是否可以以某种方式将锚点（或哈希）添加到 Struts 2 操作 URL？具体来说：我有一个html表单，如果用户单击“添加更多字段”按钮，它可以扩展更多字段。该按钮向后端发送一个html submit(动作“thismyaction”)，其中一个列表对象被另一组输入字段填充。然后，操作返回到tile“thisismyform ”,它像以前一样加载相同的jsp，在这里新的字段集是可见的。 (不幸
带有超文本标记语言内容的工具提示

当你将鼠标悬停在网页的某个区域时，有很多基于JavaScript的库会显示工具提示。有些相当简单，有些允许工具提示显示用CSS样式设计的超文本标记语言内容。但是有没有一种方法可以在不使用JavaScript的情况下显示样式化的工具提示？如果您只是使用属性，标记不会被处理（例如
JSP和Servlet在同一个超文本标记语言页面

我想开发一个包含注册和登录按钮的登录HTML页面。在运行时的HTML页面中，我可以选择任何按钮（登录/注册）。点击注册页面时，页面应重定向至注册JSP程序，点击登录页面时，页面应重定向至登录Servlet程序。现在的问题是，我必须在html页面中提到表单的实际方法？如何解决这个问题？

使用JSP、Java和Javascript的带有数据库数据的超文本标记语言表

共有1个答案

相关问答

相关文章

相关阅读

相关工具

相关文档