Envoie de formulaire via Ajax

Working example

• English example
• French example

Evaluation and report

There is no evaluation and report available for this component.

API (Version 1.0)

Function

Version 1.0

Configuration

Version 1.0

User interface (Template)

Version 1.0

Data source

Not applicable

View and style

Not applicable

i18n string

Not applicable

Function

(Version 1.0)

Function type	Name	Trigger	What it does
jQuery Event	wb-init.wb-postback	Triggered manually.	Used to manually initialize the plugin.
jQuery Event	wb-ready.wb-postback	Triggered automatically after plugin initializes.	Used to identify the element where plugin has initialized (target of the event)
jQuery Event	fail.wb-postback	Triggered automatically after the Form submission (HTTP request) fails.	Allows dynamic customization of the failure message before being shown. The `response` from the server can be accessed at `event.data.response`.
jQuery Event	success.wb-postback	Triggered automatically after the Form submission (HTTP request) succeeds.	Allows dynamic customization of the failure message before being shown.

Configuration

(Version 1.0)

Type	Option	Description	How to configure	Values
HTML attribute	multiple	Allows a single form to be submitted multiple times on the same page.	Add a data attribute called data-wb-postback-multiple.	"": Any or no value works without impact
JSON parameter	success (CSS Selector)	Identify the success message block, it will remove the CSS class defined by toggle configuration on that element.	{ "success": ".success-message" }	CSS Selector
JSON parameter	failure (CSS Selector)	Identify the failure message block, it will remove the CSS class defined by toggle configuration on that element.	{ "failure": ".failure-message" }	CSS Selector
JSON parameter	toggle (CSS Class)	CSS class to remove when the success or failure message is being displayed	{ "toggle": "hide" }	CSS class

User interface (Template)

(Version 1.0)

<form action="wb-postback-en.html" class="wb-postback" data-wb-postback='{"success":".success-message","failure":".failure-message"}'>
	... form content ...
</form>
<p class="success-message hide">Thank you!</p>
<p class="failure-message hide">Something went wrong. Please submit your information via an alternative method.</p>

Source code

Postback source code on GitHub