Anduin2017 / jquery-disable-with

Library to enable auto-disable options when submitting a form.

Home Page:https://developer.aiursoft.com/Samples/DisableWithForm

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

jquery-disable-with

npm ManHours

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.

About

Library to enable auto-disable options when submitting a form.

https://developer.aiursoft.com/Samples/DisableWithForm

License:MIT License


Languages

Language:TypeScript 57.8%Language:JavaScript 26.6%Language:HTML 11.9%Language:Shell 3.8%