Tearing my hair off of it.
Here is my button
<button type="submit" class="btn btn-primary ladda-button" data-style="zoom-in">
<span class="ladda-label">
Submit
</span>
</button>
using
Ladda.bind('.ladda-button', { timeout: 2000 });
or
Ladda.bind('button[type=submit]');
It works as advertised in Chrome, but not in Safari.
The only thing I managed to get is
var l = Ladda.create( document.querySelector('.ladda-button'));
$(document).on('click', '.ladda-button', function() {
l.start();
});
which shows the counter, but the form is not submitted.
So i tried this
var l = Ladda.create( document.querySelector('.ladda-button'));
$(document).on('click', '.ladda-button', function() {
l.start();
$(this).submit();
});
but it does not work; the form will not be submitted. Not sure what to do at this point, since I also tried a few examples in code and from SO, and no one works; counter refuses to display.
Update
A hacker solution has been detected, but it is incompatible.
$('form').submit(function (e) {
var l = Ladda.create(document.querySelector('.ladda-button'));
l.start();
alert();
});
However, if I delete alert()
, the counter does not show; and the spinner is not ideally located in the button.
There is bald at this moment ...
Update 2
It really works if I have something that interferes with the normal sending flow.
Sweet Alert, . Ladda , , Safari Ladda ?
<div class="form-group text-center m-t-30">
<button class="btn btn-primary btn-block btn-lg ladda-button" type="submit" data-style="zoom-in" id="registration">
Sign Up
</button>
</div>
javascript
$(document).on('click', '#registration', function(e) {
e.preventDefault();
swal({
title: 'Confirm',
input: 'checkbox',
inputValue: 0,
inputPlaceholder: 'Agree',
confirmButtonText: 'Continue',
confirmButtonColor: '#5d9cec',
showCancelButton: true,
cancelButtonColor: '#fffff',
reverseButtons: true,
inputValidator: function (result) {
return new Promise(function (resolve, reject) {
if (result) {
resolve();
} else {
reject('Do you agree?');
}
})
}
}).then(function (result) {
$('#form-registration').submit();
});
$.ladda('stopAll');
});