diff --git a/dist/js/core-styles/ajax-form.js b/dist/js/core-styles/ajax-form.js index 8a3d2f3..51918c3 100644 --- a/dist/js/core-styles/ajax-form.js +++ b/dist/js/core-styles/ajax-form.js @@ -62,15 +62,15 @@ $(function() { let url = $this.attr('action'); let data = $this.serializeArray(); let $target = $this; + let useLoadingIndicator = !$this.is('[data-disable-loading-indicator]'); + let $submitBtn = $this.find('[type="submit"]'); - if( $this.is('[data-disable-loading-indicator]') ) { - } else { - $this.find('button', 'input[type="submit"]').each(function(){ - let $button = $(this); - $button.prop('disabled', true); - $button.val('Loading...'); - $button.text('Loading...'); - }); + if (useLoadingIndicator) { + if (!$submitBtn.data('ajax-form-original-html')) { + $submitBtn.data('ajax-form-original-html', $submitBtn.html()); + } + $submitBtn.html(' Loading'); + $submitBtn.prop('disabled', true); } if( $this.is('[data-target]') ){ @@ -83,22 +83,38 @@ $(function() { $target = $this.parent(); } - $target.load(url,data,function(){ + $target.load(url, data, function(){ if( $this.is('[data-power-bar]') ){ loadShoppingListPowerBar(); } if( $this.is('[data-load-on-callback]') && $this.is('[data-target-on-callback]') ){ loadOnCallback(); } + if (useLoadingIndicator) { + let originalHtml = $submitBtn.data('ajax-form-original-html'); + if (originalHtml) { + $submitBtn.html(originalHtml); + $submitBtn.prop('disabled', false); + } + } }); function loadOnCallback() { let callbackUrls = $this.data('load-on-callback').split(','); let callbackTargets = $($this.data('target-on-callback')); callbackUrls.forEach(function(callbackUrl, index){ - let $callbackTarget = $(callbackTargets[index]); + let $callbackTarget = $(callbackTargets[index]); $callbackTarget.load(callbackUrl); }); } }); + // Re-enable the submit button when the user modifies the text input after a search + $(document).on('input', '[data-ajax-form] [type="text"]', function() { + let $submitBtn = $(this).closest('[data-ajax-form]').find('[type="submit"]'); + if ($submitBtn.prop('disabled') && $submitBtn.data('ajax-form-original-html')) { + $submitBtn.html($submitBtn.data('ajax-form-original-html')); + $submitBtn.prop('disabled', false); + } + }); + }); diff --git a/js/core-styles/ajax-form.js b/js/core-styles/ajax-form.js index 8a3d2f3..51918c3 100644 --- a/js/core-styles/ajax-form.js +++ b/js/core-styles/ajax-form.js @@ -62,15 +62,15 @@ $(function() { let url = $this.attr('action'); let data = $this.serializeArray(); let $target = $this; + let useLoadingIndicator = !$this.is('[data-disable-loading-indicator]'); + let $submitBtn = $this.find('[type="submit"]'); - if( $this.is('[data-disable-loading-indicator]') ) { - } else { - $this.find('button', 'input[type="submit"]').each(function(){ - let $button = $(this); - $button.prop('disabled', true); - $button.val('Loading...'); - $button.text('Loading...'); - }); + if (useLoadingIndicator) { + if (!$submitBtn.data('ajax-form-original-html')) { + $submitBtn.data('ajax-form-original-html', $submitBtn.html()); + } + $submitBtn.html(' Loading'); + $submitBtn.prop('disabled', true); } if( $this.is('[data-target]') ){ @@ -83,22 +83,38 @@ $(function() { $target = $this.parent(); } - $target.load(url,data,function(){ + $target.load(url, data, function(){ if( $this.is('[data-power-bar]') ){ loadShoppingListPowerBar(); } if( $this.is('[data-load-on-callback]') && $this.is('[data-target-on-callback]') ){ loadOnCallback(); } + if (useLoadingIndicator) { + let originalHtml = $submitBtn.data('ajax-form-original-html'); + if (originalHtml) { + $submitBtn.html(originalHtml); + $submitBtn.prop('disabled', false); + } + } }); function loadOnCallback() { let callbackUrls = $this.data('load-on-callback').split(','); let callbackTargets = $($this.data('target-on-callback')); callbackUrls.forEach(function(callbackUrl, index){ - let $callbackTarget = $(callbackTargets[index]); + let $callbackTarget = $(callbackTargets[index]); $callbackTarget.load(callbackUrl); }); } }); + // Re-enable the submit button when the user modifies the text input after a search + $(document).on('input', '[data-ajax-form] [type="text"]', function() { + let $submitBtn = $(this).closest('[data-ajax-form]').find('[type="submit"]'); + if ($submitBtn.prop('disabled') && $submitBtn.data('ajax-form-original-html')) { + $submitBtn.html($submitBtn.data('ajax-form-original-html')); + $submitBtn.prop('disabled', false); + } + }); + });