jquery-disable-with

Add-on to jQuery to enable auto-disable options when submitting a form in data-disable-with attributes.

See a demo here

How to install

$ npm install --save jquery-disable-with

And check your reference. jQuery is required!

<script src="node_modules/jquery-disable-with/dist/jquery-disable-with.js"></script>

Or using es6:

import DisableWith from 'jquery-disable-with';

How to use

Create a form

<form action="//slowaction" method="post">
    <input type="email" name="email" required/>
    <input type="password" name="password" />
    <input type="submit" value="Sign in" />
</form>

Add a submit button:

<input type="submit" value="Sign in" data-disable-with="Signing in..." />

Or a simple button like this:

<button type="submit" data-disable-with="Signing in...">Sign in</button>

Init this libarary:

new DisableWith('data-disable-with');

Run your app and click the sign-in button. When the user is submitting the form, the sign-in button will be disabled, and the text will be changed to 'Signing in...' so that the user won't press it again until the server responds.

• Support with jQuery validation. Please view document here
• Support with required attribute. Won't action when required fields are empty.