0

Есть сервлет:

@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);
}
}

и JSP-страница с несколькими полями ввода:

  <!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>


Когда нажимаю кнопку "Сохранить", у меня проходит проверка заполненности полей, а затем отрабатывает функция AJAX "sendData()". Данные успешно сохраняются в таблицу PostgreSQL.

Я сейчас хочу, чтобы после сохранения очередной записи в таблице, произошел какой нибудь select и всё содержимое таблички выгрузилось на эту же страницу внизу.

Прочитал что в JQuery есть метод load() который может загружать не только контент страницы, но и выбранного контейнера на ней. Делается это следующим образом:

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

Данный код найдет на странице something.html контейнер с id content, возьмет его содержимое и загрузит в контейнер с id area.

Дальше не знаю как. У меня по идее есть таблица с id "myTable", но как туда загружать данные?

Или это совсем не так делается?

1 ответ 1

1

Вы идёте совсем не по тому пути, который нужен.

Вам необходимо через функцию обратного вызова, которая вызывается при успешном выполнении запроса, обработать данные поступившие с сервера и разместить их на странице.

2
  • Это в $.ajax({ type: "POST", url: "/servlet/ShowParameters", success: function showResult(){ /// } }).done(function (res) { alert("send by ajax"); }); Вы это имеете ввиду?
    – Vard32
    4 сен 2016 в 9:44
  • Что то с форматированием у меня тут беда... Я имею ввиду в success: function showResult(){ // } .. Я правильно Вас понял?
    – Vard32
    4 сен 2016 в 9:47

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.