jQuery Plugin For Adding Loading Indicators To Buttons - loadingButton

loadingButton is a very small jQuery plugin to add loading state to buttons when clicked. Helps you create button loaders with built-in loading indicators.

See also:

• Buttons with Built-in Loading Indicators For Bootstrap 3 - Ladda Bootstrap
• Form Submit Buttons with Built-in Loading Indicators - Ladda
• jQuery Plugin For Built-In Loading Indicator In Buttons - Button Loader

How to use it:

1. Include jQuery JavaScript library and the jQuery loadingButton plugin at the bottom of the html page.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="jquery.loadingbutton.js"></script>

2. Simple usage via data attributes. Add attribute data-loading-button to automatically hook up JavaScript click handler. Set the text of the button with data-loading-text.

<input type="button" data-loading-button="true" data-loading-text="Loading...">

3. More advanced use with jQuery plugin method and options.

$('#my-button').loadingButton({

  // Set to true or false if the button should be disabled while loading
  disable: true, 

  // Set the text of the button while loading
  loadingText: 'Loading...', 

  // Set the class that should be added to button while loading,
  loadingClass: 'loading' 

  // Function that returns true or false. 
  // If false button will not get loading state.
  condition: function() {  } 
  
});

---

This awesome jQuery plugin is developed by andreasnylin. For more Advanced Usages, please check the demo page or visit the official website.