diff options
author | Kasper Timm Hansen <kaspth@gmail.com> | 2017-07-15 21:17:27 +0200 |
---|---|---|
committer | Kasper Timm Hansen <kaspth@gmail.com> | 2017-07-15 21:17:27 +0200 |
commit | aad42dce10a9cc110d67fa03a72ce5b41cbb394a (patch) | |
tree | 7c22623e9f34f2ff7bfa142385010b6a4e5aea85 /guides/source/working_with_javascript_in_rails.md | |
parent | 92fb8621a623afb33a145b1f3736010a3c870086 (diff) | |
parent | b6300f3ecc79bff29cf9bb804a30fd92403feac1 (diff) | |
download | rails-aad42dce10a9cc110d67fa03a72ce5b41cbb394a.tar.gz rails-aad42dce10a9cc110d67fa03a72ce5b41cbb394a.tar.bz2 rails-aad42dce10a9cc110d67fa03a72ce5b41cbb394a.zip |
Merge branch 'master' into unlock-minitest
Diffstat (limited to 'guides/source/working_with_javascript_in_rails.md')
-rw-r--r-- | guides/source/working_with_javascript_in_rails.md | 29 |
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..ed27752a06 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 has changed. +Unlike the version with jQuery, all custom events return only one parameter: `event`. +In this parameter, there is an additional attribute `detail` 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 -------------------- |