Como capturar o formulário de envio de uma página que tem vários formulários - jquery, forms, laravel, submit, capture

Eu tenho uma tabela que contém faturas, o que significaexistem várias linhas, cada linha contém um formulário no qual o usuário pode enviar um pagamento. Como posso interceptar o envio do formulário correto com o jquery?

No momento, posso interceptar o envio do primeiro formulário, mas preciso que isso seja mais versátil e permita que eu intercepte o envio de qualquer formulário.

Qualquer ajuda é apreciada, obrigado pelo seu tempo.

Meu código atual:

payment.blade.php

<form action="{{"/users/payment"}}" method="post" id="checkout-form">

checkout.js

$(document).ready(function() {
console.log("Checkout.js is running!");
Stripe.setPublishableKey("...");

var $form = $("form:last");
console.log($form);
$form.submit(function (event) {
console.log("form submit event clicked");
$("charge-error").addClass("hidden");
$form.find("button").prop("disabled", true);
if ($("#paymentMethod").val() == "Saved Card") {
console.log("reaching if statement");
// No new card is used so just submit the form.
$form.get(0).submit();
return false;
} else {
console.log("reaching else statement");
console.log($("#card-number").val());

Stripe.card.createToken({
number: $("#card-number").val(),
cvc: $("#card-cvc").val(),
exp_month: $("#card-expiry-month").val(),
exp_year: $("#card-expiry-year").val()
}, stripeResponseHandler);
return false;
}
});

function stripeResponseHandler(status, response) {
if (response.error) {
console.log("reaching error statement");
$("#charge-error").removeClass("hidden");
$("#charge-error").text(response.error.message);
$form.find("button").prop("disabled", false);
} else {
console.log("reaching successful response statement");
var token = response.id;
// Insert the token into the form so it gets submitted to our local server:
$form.append($("<input type="hidden" name="stripeToken" />").val(token));

// Submit the form:
$form.get(0).submit();
}
}

});

Respostas:

Simplesmente altere o seletor de formulário

var $form = $("form");

Então

$form.submit(function(){
//Every form submit will trigger this function
});

Para acessar os elementos filho de um formulário

$form.submit(function(){
$this = $(this);
var number = $this.find("#card-number").val(),
cvc = $this.find("#card-cvc").val(),
exp_month = $this.find("#card-expiry-month").val(),
exp_year = $this.find("#card-expiry-year").val();
});