In a pure Javascript way, you can submit the form after preventing default.
This is because HTMLFormElement.submit()
never calls the onSubmit()
. So we're relying on that specification oddity to submit the form as if it doesn't have a custom onsubmit handler here.
var submitHandler = (event) => {
event.preventDefault()
console.log('You should only see this once')
document.getElementById('formId').submit()
}
See this fiddle for a synchronous request.
Waiting for an async request to finish up is just as easy:
var submitHandler = (event) => {
event.preventDefault()
console.log('before')
setTimeout(function() {
console.log('done')
document.getElementById('formId').submit()
}, 1400);
console.log('after')
}
You can check out my fiddle for an example of an asynchronous request.
And if you are down with promises:
var submitHandler = (event) => {
event.preventDefault()
console.log('Before')
new Promise((res, rej) => {
setTimeout(function() {
console.log('done')
res()
}, 1400);
}).then(() => {
document.getElementById('bob').submit()
})
console.log('After')
}
And here's that request.