Submit form in stepper not working
I have the following code from create-app.js. How to modify the code so that the form will be submitted to server side upon clicking the submit button.
formSubmitButton.addEventListener('click', function (e) {
// Validate form before change stepper step
var validator = validations[2]; // get validator for last formvalidator.validate().then(function (status) {
formSubmitButton.disabled = false;
if (status == 'Valid') {
// Prevent default button action
e.preventDefault();
// Disable button to avoid multiple click
formSubmitButton.disabled = true;
// Show loading indication
formSubmitButton.setAttribute('data-kt-indicator', 'on');
// Simulate form submission
setTimeout(function() {
// Hide loading indication
formSubmitButton.removeAttribute('data-kt-indicator');
// Enable button
formSubmitButton.disabled = false;
$( "#create_new_bo" ).submit();
}, 2000);
} else {
Swal.fire({
text: "Sorry, looks like there are some errors detected, please try again.",
icon: "error",
buttonsStyling: false,
confirmButtonText: "Ok, got it!",
customClass: {
confirmButton: "btn btn-light"
}
}).then(function () {
KTUtil.scrollTop();
});
}
});
});
Replies (4)
I tried $( "#create_new_bo" ).submit(); but it does not work
Hi,
You should use the form object and call it's submit method form.submit() as shown below:
Replace the below demo timeout code to similate the form processing:
// Simulate form submission
setTimeout(function() {
// Hide loading indication
formSubmitButton.removeAttribute('data-kt-indicator');// Enable button
formSubmitButton.disabled = false;
stepperObj.goNext();
}, 2000);
With the below actual code:
// Hide loading indication
formSubmitButton.removeAttribute('data-kt-indicator');// Enable button
formSubmitButton.disabled = false;
stepperObj.goNext();
form.submit();
Regards.
Thank you Sean!. You saved my life. All good now.
Always glad to help you 
