JSFiddle - React, Tailwind, and code Playground
HTML
<form id="form1" onsubmit="jqsub(this);return false;">
<input type="submit" value="Go Form 1!" />
</form>
<form id="form2" onsubmit="jqsub2(this);return false;">
<input type="submit" value="Go Form 2!" />
</form>
JavaScript
function jqsub(){
alert("hi")
//Form 1
var $form = $('#form1');
var $messagebox = $('#hide-message');
var $successmessage = " ";
$.ajax({
type: 'POST',
url: $form.attr('action'),
data: $form.serialize(),
success: function (msg) {
$messagebox.append($successmessage);
$messagebox.delay(800).fadeIn(550);
$form.fadeOut(250);
}
});
}
function jqsub2(){
//Form 2
var $form2 = $('#form2');
var $messagebox2 = $('#hide-message2');
var $successmessage2 = " ";
$.ajax({
type: 'POST',
url: $form2.attr('action'),
data: $form2.serialize(),
success: function (msg) {
$messagebox2.append($successmessage2);
$messagebox2.delay(800).fadeIn(550);
$form2.fadeOut(250);
}
});
}