blob: 714295764e143814902051efaa9307665c6ff4ca (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
|
/*
* Buttons.js
*
* Use bootstrap loading state after submitting a form.
*
* Some form inputs are validaded before the submission
* so triggering loading state on click events is not a
* good idea. If the validation fails the errors will
* be displayed but the button would be in loading state.
*
* We used to trigger it based on form submission but
* we have a few forms that contain multiple buttons.
* So now we mark the buttons as clicked on click and
* put the clicked button into loading state on submit.
*
*/
(function() {
markAsClicked = function () {
var btn = $(this)
btn.addClass('clicked')
setTimeout(function () {
btn.removeClass('clicked')
}, 1000)
};
markAsLoading = function(submitEvent) {
var form = submitEvent.target;
$(form).addClass('submitted')
// bootstrap loading state:
$(form).find('.btn.clicked[type="submit"]').button('loading');
};
$(document).ready(function() {
$('form').submit(markAsLoading);
$('.btn[type="submit"]').click(markAsClicked);
});
}).call(this);
|