使用java servlet从html表单加载数据，更新数据库并在表中的同一页面上显示数据答案

【问题标题】：Load data from html form, update database and display data on the same page in table using java servlet使用java servlet从html表单加载数据，更新数据库并在表中的同一页面上显示数据
【发布时间】：2017-04-01 13:27:46
【问题描述】：

我需要一些帮助。我有一个由 Java Servlet 和 html 表单组成的小应用程序。用户将一些数据放入 html 表单中，单击提交按钮后，java servlet 在其 post 方法中获取数据（将其加载到数据库中）。到目前为止一切正常。我正在使用 java servlet 和 tomcat。我现在要做的是在html的同一页面上的表格中显示数据。我发现，这可以通过 ajax get 方法实现。但不知何故，我无法做到这一点。这是我的应用程序的简化代码： Java Servlet：

@WebServlet(name = "MyServlet", urlPatterns = { "/MyServlet" })
public class MyServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse    response) throws ServletException, IOException {
response.setContentType("text/html");
// getting the values submitted by the user from the html form
String name = request.getParameter("name");
String surname = request.getParameter("surname");
// here goes some logic to load data in the database
// data from database is recieved as an array and is then converted to 
// json 
// here I can only print the whole json retrieved from DB 
// and it is displayed on another page with myurl/MyServlet
 response.setContentType("application/json");
 PrintWriter out = response.getWriter();
 response.setCharacterEncoding("UTF-8");
 out.println(json);

}
public void doGet(HttpServletRequest request, HttpServletResponse   response) throws IOException{
// nothing happens here
}

在我的 html 表单中，我有以下内容（仅此处最重要的内容）：

<form action="MyServlet" method="post">
<input class="form-control" type="text" name="name" id="name">
<input class="form-control" type="text" name="surname" id="surname">
<input type="submit" class="btn btn-info" id="MyS"value="MyServlet">
<table class="table" id="table">
<tr>
    <th>name</th>
    <th>surname</th>
</tr>

用户输入存储在数据库中，一切正常。问题是，我没有得到回应，我想在表格中显示用户提供的所有数据，每次提交后应该更新这些数据，并且用户应该留在同一页面上（实际上不知道，如何做这个）。从数据库中，我得到一个可以转换为 JSON 的数组，所有这些信息都应该显示在一个表中。我试着写一些这样的 ajax.get（我是一个真正的 javascript 新手）：

<script>
<script type="text/javascript">
$("#MyS").click(function() {

}
$.ajax({
    url: "/MyServlet",
    type: "POST",
    dataType: '{json: json}',
    data: myvalue,

    success: function(data) {  
        $('#table').append(data);
    },
});
</script>

但是没有数据显示在表格或某处。我很乐意得到一些提示我做错了什么以及应该如何正确完成？提前致谢。

【问题讨论】：

标签： java html ajax servlets html-table

【解决方案1】：

用这些行执行它并告诉我你在浏览器的控制台中得到什么响应：

$.ajax({
    url: "/MyServlet",
    type: "POST",
    dataType: '{json: json}',
    data: myvalue,
    success: function(data) 
    {  
        console.log( data ); // logs this on success
        $('#table').append(data);
    },
    **error: function (textStatus, errorThrown) 
    {
        console.log( textStatus ); // log this on error
        console.log( errorThrown );
    }**
});

【讨论】：