java - jquery是否可以同时提交表单并发送ajax请求

Question

我想提交一个表单，同时向我的 Spring MVC 服务器发送一个 ajax 请求。为此，我有一个这样的表格:

<form id='confirma' method='post' action='confirma'>
  <button type='submit' id='save' class='btn btn-success' value='Save'>Enviar</button>
</form>

在我的服务器中，我有两种方法来接收这两个请求(ajax 请求和普通表单提交)。

// receive from form
@RequestMapping("fromForm")
public String fromForm(Model model)
{    
   // get atb1 values from database
   model.addAttribute("atb1", atb1);

   return "file.jsp";    
}

// receive from ajax
@RequestMapping("fromAjax")
public void fromAjax(String jsonData)
{    
   // deserialize json Data and insert it on database
   System.out.println("data received!");        
}

我的目的是接收来自 Ajax 请求的数据，将其保存在数据库中，并在表单提交方法中获取此数据，在本例中称为 fromForm。

我知道这可能看起来很疯狂，但我这样做是因为我有一系列提交表单，我想让它们彼此独立，这样我就可以调用它们中的任何一个，而无需传递之前的数据形式。

我尝试使用 jQuery 来处理它。这就是我所做的:

function ajaxRequest() {  
    var jsonArray = new Array();

    // Complete the jsonArray with an Array of objects created by myself

    $.ajax({
        url: "fromAjax",
        cache: false,
        contentType: false,
        processData: false,
        data: JSON.stringify(jsonArray, null, 4),
        type: 'POST',
        success: function (data, textStatus, jqXHR) {
               console.log("success ajax");
               return true;
        },
        error: function (xhr, status, error) {
               console.log("error ajax");
               return false;
        }
    });
}
$(document).on('submit', '#confirma', function(event) {
    event.preventDefault();
    // by return this method, I would just call the another jsp page, if the ajax              
    // request is completed successfully 
    return ajaxRequest();
});

但这不起作用。如果我在表单提交中删除 event.preventDefault，我只会在服务器上收到表单提交。如果我有 event.preventDefault 调用，则只有 ajax 请求会到达服务器。

如何使这两个请求都到达服务器？

Answer 1

从浏览器的角度考虑这一点。想象一下，它已成功向 /fromAjax 触发 XmlHttpRequest ，并向 /confirma 触发常规表单提交 POST。现在想象一下服务器首先响应POST/confirma。当表单提交响应包含要显示的新 HTML 页面或重定向到另一个页面时，浏览器要做什么 - 浏览器应该如何处理(仍待处理的)XmlHttpRequest？

或者，如果您从服务器的角度来看 - 当服务器在收到或开始处理对 的请求之前处理对您的 fromForm() 方法的请求时，会发生什么>fromAjax() 方法？

如果您的意图是

receive the data from the Ajax request, save it in database, and get this data in the form submission method

然后我会首先发送ajax请求，然后当您收到响应时，触发Javascript的表单提交，以便这些请求串行发生(一个接一个)而不是并行发生。