tecte/ajaxable

Make your forms instantly ajaxable

Ajaxable

This library simply takes the standard HTML forms as an input and make them send requests via AJAX keeping HTML5 validations.

Demo

Installation

Download the file from here, via npm i ajaxable or get it directly from the /dist folder

Usage

Basic

<script src="path/to/ajaxable.min.js"></script>

<form id="myform" method="POST" action="https://se.nd/it/somewhere">
  <input name="name" placeholder="Name"/>
  <input name="email" placeholder="Email" type="email" required/>
  <button>Send</button>
</form>

<script type="text/javascript">
  ajaxable('#myform');
</script>

Listen events

ajaxable('#myform')
.onStart(function(params) {
  // Make stuff before each request, eg. start 'loading animation'
})
.onEnd(function(params) {
  // Make stuff after each request, eg. stop 'loading animation'
})
.onResponse(function(res, params) {
  // Make stuff after on response of each request
})
.onError(function(err, params) {
  // Make stuff on errors
});

The params argument is an object containing additional data about the specific request. For example, el is the form element which made the request and activeRequests indicates how many requests are still pending (useful with multiple forms)

Development

Clone the repository and enter inside the folder

$ git clone https://github.com/artf/ajaxable.git
$ cd ajaxable

Install it

$ npm i

Start the dev server

$ npm start

Build before the commit. This will also increase the patch level version of the package

$ npm run build

API

API Reference here

Testing

Run tests

$ npm test

Run and watch tests

$ npm run test:dev

Compatibility

All modern browsers (IE > 9)

License

MIT