JSFiddle - React, Tailwind, and code Playground
by mollwe
HTML
<html>
<head></head>
<body>
<form action="#" method="POST">
<input type="text" name="value" />
<input type="submit" value="submit"/>
</form>
</body>
</html>
JavaScript
/*!
* jquery.ajaxSubmit.js - v 0.9.1 (2011-11-26)
* Copyright (C) 2011 by Adam Ydenius ([email protected]) | http://mollwe.se
* Dual licensed under MIT and GPL.
*
* Gets all input (with name attribute) values within form and submits form with ajax.
* First argument, options, is object with:
* Properties:
* - url: override form action.
* - method: override form method.
* - data: extend data found from inputs.
* Callbacks ("this" variable is jQuery(form element)):
* - beforeSend: function(jqXHR, ajaxSettings)
* - success: function(data, textStatus, jqXHR)
* - error: function(jqXHR, textStatus, errorThrown)
* - complete: function(jqXHR, textStatus)
*
* After initialization you can call $(elem).ajaxSubmit("method") where available
* methods is:
* - submit: trigger submit manually
* - option: get or set settings
* - destroy: unbind events and remove data for ajaxSubmit
*
* Events ("this" variable is jQuery(form element)):
* - ajaxsubmitbeforeSend: function(event, jqXHR, ajaxSettings)
* - ajaxsubmitsuccess: function(event, data, textStatus, jqXHR)
* - ajaxsubmiterror: function(event, jqXHR, textStatus, errorThrown)
* - ajaxsubmitcomplete: function(event, jqXHR, textStatus)
*
* Author: Adam Ydenius ([email protected])
*/
(function ($) {
$.fn.ajaxSubmit = function (method) {
var methods = {
init: function (options) {
var settings = $.extend({
action: null,
method: null,
data: null,
beforeSend: null,
success: null,
error: null,
complete: null
}, options);
return this.each(function () {
var $this = $(this);
if (!$this.is("form")) $.error("Element must be of type form.");
$this.data("ajaxSubmit", $.extend({}, settings));
$this.bind("submit.ajaxSubmit", function (event) {
...