title = "JavaScript Requests | Snowboard" url = "/snowboard/js-requests" layout = "snowboard" == 'AJAX Request was successful!', ]; } function onFormSubmission() { if (empty(post('name'))) { return [ '#form-submission-response' => '
You did not provide your name.
', ]; } elseif (empty(post('email'))) { return [ '#form-submission-response' => '
You did not provide your email address.
', ]; } else { return [ '#form-submission-response' => '
Your name is ' . post('name') . ' and you can be contacted via email at ' . post('email') . '.
', ]; } } function onError() { throw new ApplicationException('This AJAX response threw an exception.'); } function onFlash() { $type = post('type', 'success'); Flash::$type('This is a flash message'); } function onPrepend() { return [ '^#prepend-content' => '
' . date('Y-m-d H:i:s') . '
', ]; } function onAppend() { return [ '@#append-content' => '
' . date('Y-m-d H:i:s') . '
', ]; } ==
{% partial 'snowboard/sections-list' %}

JavaScript Requests


Simple request

This is a test to do a simple AJAX request on the click of a button and show a success message next to the button on completion.

{% partial 'ui/button' color="amber" text="Test now" %}

Form submission

This is a test to make a form submission via AJAX and display the form contents on completion. The AJAX request is initiated from the Submit button.

{% partial 'ui/button' color="amber" text="Submit" %}

Error response

This is a test to do an AJAX request that throws an exception. It should show a Flash error message.

{% partial 'ui/button' color="amber" text="Test now" %}

Flash response

This is a test to do an AJAX request that sends a Flash response back of differing types.

{% partial 'ui/button' color="green" text="Test success" %}
{% partial 'ui/button' color="amber" text="Test warning" %}
{% partial 'ui/button' color="red" text="Test error" %}

Appended and prepended content

This is a test to do an AJAX request that appends or prepends content as opposed to replacing the content of the targeted element.

{% partial 'ui/button' color="amber" text="Test prepend" %}
Prepended content
{% partial 'ui/button' color="amber" text="Test append" %}
Appended content