1.1.3 • Published 5 years ago

formey v1.1.3

Weekly downloads
23
License
-
Repository
github
Last release
5 years ago

📜️ Formey

npm version

What is Formey

Formey is a JavaScript code that prevents <form> from being submitted after the first submission.

  • No dependencies
  • Zero-configuration out-of-the-box
  • Utilizes HTML5 data attributes
  • 0.6 kB gziped

Getting started

CDN

Place the latest production bundle before the closing </body> and call formey:

<script src="https://unpkg.com/formey"></script>
<script>
  formey();
</script>

Download

Download formey.js or minified production ready formey.min.js. Place it before the closing </body> and call dialog init:

<script src="script/formey.min.js"></script>
<script>
  formey();
</script>

NPM

Install package with npm install formey. Call formey:

import formey from 'formey';

formey()

Usage

Use data attributes to enable formey prevent form from being submitted more than once.

<form data-submit-once>
  <!-- form markup -->
</form>

You can specify data-submit-text with custom text on submit trigger (button or input). Once the form is submitted, submit trigger text will change to then given via data-submit-text attribute.

<form data-submit-once>
  <!-- form markup -->
  <button data-submit-text="Sending...">Send</button>
</form>

See Example.

API

Attributes

Attribute: data-submit-once
Value: None.
Placement: <form> elements.
Description: Form with this attribute will be prevented from submission more than once.


Attribute: data-submit-text
Value: Any.
Placement: Submit types of <button> and <input>.
Description: Once the form is submitted, text of element with this attribute will change to the given.


Options

Pass options object to formey function. E.g.:

formey({
  formAttr: 'data-form',
  submitInProcessAttr: 'data-submitting'
});
KeyTypeDefaultDescription
formAttrStringdata-submit-onceData attribute to mark form to be processed.
submitTextAttrStringdata-submit-textData attribute to specify custom text label for submit trigger element.
submitInProcessAttrStringfalseSpecified data attribute will be added to the given element after form is being submitted. (Tip: May be useful for custom CSS styling)
clearAttrsOnInitBooleantrueRemove formey data attributes from HTML elements after init.

License

This project is licensed under the MIT License - see the LICENSE file for details.

1.1.3

5 years ago

1.1.2

5 years ago

1.1.1

5 years ago

1.1.0

5 years ago

1.0.1

5 years ago

1.0.0

5 years ago

0.0.1

5 years ago