In this guide, I will teach you how to submit forms using Ajax, with a simple jQuery plugin that I have coded today.
Dependencies
Guide
Creating the form.
The Javascript
This will just simple submit the form to the specified URL in the action entity of your form.
Scenarios
- Not using the URL specified in the form's action entity.
Well of course, there are more options that can be viewed
Dependencies
- dynForm (
You must be registered for see links)
- jQuery (
You must be registered for see links)
Guide
Creating the form.
HTML:
<form action="" method="POST" class="ajax_form">
<input type="text" name="username" />
<input type="password" name="password" />
<input type="submit" name="login" value="Log In" />
</form>
The Javascript
HTML:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="jquery.dynform.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('form.ajax_form').dynForm();
});
</script>
Scenarios
- Not using the URL specified in the form's action entity.
HTML:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="jquery.dynform.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('form.ajax_form').dynForm({
url: 'http://custom_url_here.com/'
});
});
</script>
Well of course, there are more options that can be viewed
You must be registered for see links
.
Last edited: