There is a servlet:

@WebServlet("/") public class MainServlet extends HttpServlet { @Override public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // } @Override public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { Map columns = new HashMap(); columns.put("FirstName", request.getParameter("FirstName")); columns.put("SecondName", request.getParameter("SecondName")); columns.put("LastName", request.getParameter("LastName")); columns.put("Receiver", request.getParameter("Receiver")); columns.put("Theme", request.getParameter("Theme")); columns.put("Message", request.getParameter("Message")); boolean hasConnected; DBController db = new DBController(); hasConnected = db.isConnected(); if(hasConnected) { System.out.println("DB connected"); System.out.println(db.insert("mytable", columns)); } else System.out.println("Connection failed!"); doGet(request, response); } }

and a JSP page with several input fields:

  <!DOCTYPE html> <HTML> <HEAD> <TITLE>Π€ΠΎΡ€ΠΌΠ° ΠΎΠ±Ρ€Π°Ρ‚Π½ΠΎΠΉ связи</TITLE> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> <script type="text/javascript"> function sendData() { $.ajax({ type: "POST", url: "/servlet/ShowParameters", data: $('#formId').serialize(), }).done(function (res) { alert("send by ajax"); }); } </script> <script type="text/javascript"> $(document).ready(function() { $(".button").click(function(){ ver = true; first_name = $("#FirstName").val(); second_name = $("#SecondName").val(); last_name = $("#LastName").val(); var p = /^[Π°-яА-ЯёЁa-zA-Z0-9 \-]{2,35}$/i; if(!p.test(first_name)) { message_a = "Π£ΠΊΠ°ΠΆΠΈΡ‚Π΅ Ѐамилию"; ver = false; } else if(!p.test(second_name)) { message_a = "Π£ΠΊΠ°ΠΆΠΈΡ‚Π΅ Имя"; ver = false; } else if(!p.test(last_name)) { message_a = "Π£ΠΊΠ°ΠΆΠΈΡ‚Π΅ ΠžΡ‚Ρ‡Π΅ΡΡ‚Π²ΠΎ"; ver = false; } if(ver) { sendData(); return true; } else { alert(message_a); return false; } }); }); </script> </HEAD> <BODY> <form ACTION = "/servlet/ShowParameters" method = "post" id = "formId"> Ѐамилия:<input TYPE="TEXT" id = "FirstName" NAME = "FirstName"> Имя:<input TYPE="TEXT" id = "SecondName" NAME = "SecondName"> ΠžΡ‚Ρ‡Π΅ΡΡ‚Π²ΠΎ:<input TYPE="TEXT" id = "LastName" NAME = "LastName"> <input type = "button" class = "button" value = "Π‘ΠΎΡ…Ρ€Π°Π½ΠΈΡ‚ΡŒ"/> <div style = "font-family: 'Calibri Light'"> <br><hr> <table id = "myTable" width="100%"> <tr> <td>Ѐамилия</td> <td>Имя</td> <td>ΠžΡ‚Ρ‡Π΅ΡΡ‚Π²ΠΎ</td> </tr> </table> </div> </form>


When I press the " Save " button, I have a field validation check, and then the AJAX " sendData () " function works. The data is successfully saved to the PostgreSQL table.

I now want that after saving the next record in the table, some sort of select should occur and all the contents of the table should be uploaded to the same page below.

I read that in JQuery there is a load () method that can load not only the content of the page, but also the selected container on it. This is done as follows:

  $("#area").load("something.html #content");

This code will find a container with id content on the something.html page, take its contents and load it into a container with id area .

I don’t know how. I think there is a table with id "myTable", but how to load data there?

Or is it not done at all?

    1 answer 1

    You do not go the way that is needed.

    You need through a callback function, which is called upon successful completion of the request , to process the data received from the server and place it on the page.

    • This is in $ .ajax ({type: "POST", url: "/ servlet / ShowParameters", success: function showResult () {///}}). Done (function (res) {alert ("send by ajax" );}); Do you mean it? - Vard32
    • Something with formatting I have trouble here ... I mean in success: function showResult () {//} .. I understand you correctly? - Vard32