aboutsummaryrefslogtreecommitdiffstats
path: root/guides
diff options
context:
space:
mode:
authorVipul A M <vipulnsward@gmail.com>2017-06-15 13:15:55 +0530
committerGitHub <noreply@github.com>2017-06-15 13:15:55 +0530
commitbbd8084ffe413e1f0848fc09432997011909f232 (patch)
tree46bfade45e9f1cee819a77db06cc9fea5067a80c /guides
parentf2af91a7908d3474746e20781a3118379189a7aa (diff)
parent0cd957ef453d31218eb99c0149589814cc7ef685 (diff)
downloadrails-bbd8084ffe413e1f0848fc09432997011909f232.tar.gz
rails-bbd8084ffe413e1f0848fc09432997011909f232.tar.bz2
rails-bbd8084ffe413e1f0848fc09432997011909f232.zip
Merge pull request #29442 from DmytroVasin/rails-ujs-docs
Update `working with javascript` readme to support rails-ujs behaviour. [ci skip]
Diffstat (limited to 'guides')
-rw-r--r--guides/source/working_with_javascript_in_rails.md29
1 files changed, 29 insertions, 0 deletions
diff --git a/guides/source/working_with_javascript_in_rails.md b/guides/source/working_with_javascript_in_rails.md
index 290f2a509b..35e6aea4cf 100644
--- a/guides/source/working_with_javascript_in_rails.md
+++ b/guides/source/working_with_javascript_in_rails.md
@@ -376,6 +376,35 @@ browser to submit the form via normal means (i.e. non-AJAX submission) will be
canceled and the form will not be submitted at all. This is useful for
implementing your own AJAX file upload workaround.
+### Rails-ujs event handlers
+
+Rails 5.1 introduced rails-ujs and dropped jQuery as a dependency.
+As a result the Unobtrusive JavaScript (UJS) driver has been rewritten to operate without jQuery.
+These introductions cause small changes to `custom events` fired during the request:
+
+NOTE: Signature of calls to UJS’s event handlers have changed.
+Unlike the version with jqeury, all custom events return only one parameter: `event`.
+In this parameter, there is an additional attribute `details` which contains an array of extra parameters.
+
+| Event name | Extra parameters (event.detail) | Fired |
+|---------------------|---------------------------------|-------------------------------------------------------------|
+| `ajax:before` | | Before the whole ajax business. |
+| `ajax:beforeSend` | [xhr, options] | Before the request is sent. |
+| `ajax:send` | [xhr] | When the request is sent. |
+| `ajax:stopped` | | When the request is stopped. |
+| `ajax:success` | [response, status, xhr] | After completion, if the response was a success. |
+| `ajax:error` | [response, status, xhr] | After completion, if the response was an error. |
+| `ajax:complete` | [xhr, status] | After the request has been completed, no matter the outcome.|
+
+Example usage:
+
+```html
+document.body.addEventListener('ajax:success', function(event) {
+ var detail = event.detail;
+ var data = detail[0], status = detail[1], xhr = detail[2];
+})
+```
+
Server-Side Concerns
--------------------