JQuery - Envie todos os formulários por um botão - javascript, jquery

Html:

<form class="allforms" method="POST" action="/auth/myaccount/personal">
<input type="hidden" name="_method" value="PATCH">
...
</form>

<button id="allsubmit" class="btn btn-info">Continue</button>

jquery:

$(document).ready(function(){
$("#allsubmit").click(function(){
$(".allforms").submit();
});
});

Eu tenho 3 formulários no meu código html como acima. Meu botão está fora dos meus formulários. Como ter um botão de envio para todos os meus formulários. Eu tentei a função de clique, mas ela não funciona. Por quê?

Respostas:

O envio do formulário é uma ação síncrona. Portanto, quando você envia um formulário e imediatamente envia um formulário diferente na sua página, o envio do primeiro formulário é cancelado.

O que você pode fazer é garantir que os formulários sejam enviados de forma assíncrona (usando ajax):

$(function() {
$("#allsubmit").click(function(){
$(".allforms").each(function(){
valuesToSend = $(this).serialize();
$.ajax($(this).attr("action"),
{
method: $(this).attr("method"),
data: valuesToSend
}
)
});
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form class="allforms" method="POST" action="">
<input type="hidden" name="_method" value="PATCH1">
<input type="submit" />
</form>

<br />
<form class="allforms" method="POST" action="">
<input type="hidden" name="_method" value="PATCH2">
<input type="submit" />
</form>

<br />
<form class="allforms" method="POST" action="">
<input type="hidden" name="_method" value="PATCH3">
<input type="submit" />
</form>

<br />
<button id="allsubmit" class="btn btn-info">Continue</button>

Algumas notas

1. este não vou trabalhar com formulários com upload de arquivos (enctype = "multipart / form-data")
2. Você precisa decidir o que fazer depois que o envio for concluído (porque nada na página será alterado).
3. Você não pode enviar formulários no stackoverflow-snippets, portanto, não tente executar isso aqui :)

Não testei, mas tente este:

$("#allsubmit").on("click", function(){
$(".allforms").each(function(){
$(this).submit();
});
});

Observe que todos os seus formulários precisam ter class="allforms" atributo