Ajax forms made even more easy

A built-in event handler let you send classic forms using ajax by simply adding the domajax class to your submit button.

This event let you avoid setting the data-endpoint, data-input and data-method attributes on a submit button when your form is standard, as all those options are already set in the <form> definition.

  • data-endpoint is automatically took from the action="" attribute
  • data-input is set to the form id (automatically generated if undefined)
  • data-method is took from the method="" attribute of the form

To use this event handler, just add the domajax class to your submit button. If you want to add more domajax options (such as data-output or data-lock), you also need to add them to the submit button.

Examples


  • <input type="submit" class="domajax" value="Send" />
  • <input type="submit" class="domajax" data-output="#output" value="Send" />
  • ...

Live examples

This form looks like this:


<form action="event-form-classic-handler.php" method="post">
    <label for="name">Enter your name</label>
    <input type="text" id="name" name="name" value="Mike"/>
    <br/>
    <input type="submit" value="Submit" class="btn domajax" data-output="#output"/>
</form>

<div id="output"></div>

This form looks like this:


<form action="event-form-get-handler.php" method="get">
    <label for="name">Enter your name</label>
    <input type="text" id="name" name="name" value="Mike"/>
    <br/>
    <input type="submit" value="Submit" class="btn domajax" data-output="#output"/>
</form>

<div id="output"></div>

This form looks like this:


<form id="form" action="event-form-options-handler.php" method="post" data-lock="">
    <label for="name">Enter your name</label>
    <input type="text" id="name" name="name" value="Mike"/>
    <br/>
    <input
            type="submit"
            value="Send"
            class="btn domajax"
            data-output="#output"
            />
</form>

<div id="output"></div>


Table of contents

All the documentation at a glance

Domajax options

And more with domajax