Использование JQuery и AJAX для подключения к бэкэнду

Question

Я реализую приложение Spring Boot и реализую интерфейс, который будет использовать ajax для подключения к загрузочной части Sprint.Это первый раз, когда я использую интерфейс и мне нужна помощь.Я не знаю, где я иду не так.Я хочу передать JSON бэкэнду для дальнейшей обработки.

Код находится здесь https://github.com/rajivpjs/Customer-Inventory/tree/23_ConnectToBackEnd в папке customer / src / main / resources / static / js папка

Текущая реализация может быть отлажена в загрузочном приложении Spring, но возвращает нулевой объект User и Customer.

Вызов ajax:

 $.ajax({
       type: "POST",
       url: "/register/customer",
       data: JSON.stringify({ 
              "email":     $('#email').val(), 
              "pass":      $('#pass').val(), 
              "firstName": $('#firstName').val(), 
              "lastName":  $('lastName').val() }),
       dataType: "json",
       contentType : "application/json;charset=utf-8",
       success: function(data)
       {
           alert("data");
       },
       error: function(data) {
           alert(data);
       }
     });

     e.preventDefault();
});

Не могли бы вы помочь?

Спасибо.

Answer 1

Первое, что нужно упомянуть, это то, что вам нужно отключить отправку формы с использованием стандартного html <input type='submit'> и связать ваш вызов ajax нажатием соответствующей кнопки ИЛИ удалить вашу реализацию ajax и отправить свою форму с использованием html submit.Я приведу пример для первого случая.Я предполагаю, что вы удалили type=submit из вашей формы.

$("#your-button").on('click', function(e) {
    e.preventDefault();
    var formData = $("#signup-form").serialize();

    console.log(formData);
    $.ajax({
           type: "POST",
           url: "/register/customer",
           data: formData,
           dataType: "json",
           contentType : "application/json;charset=utf-8",
           success: function(data)
           {
               alert("data");
           },
           error: function(data) {
               alert(data);
           }
         });
});

РЕДАКТИРОВАТЬ:

Боюсь, что не сработало.Это ошибка на бэкэнде, говорящая об ошибке разбора JSON: Нераспознанный токен 'firstName': ожидал 'null', 'true', 'false'.