Postback

Questions or comments?

Purpose

Submit web form through AJAX call.

Working 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

Date modified: