Emit events by default on load and error
🔥 Firing events on success and fail by default
In this version, render_async will emit emits by default. If your request is finished successfully, a render_async_load
event will fire. If it goes badly, the render_async_error
will fire.
You can then catch these events in your code with something like this:
document.addEventListener('render_async_load', function(event) {
console.log('Async partial loaded in this container:', event.container);
});
document.addEventListener('render_async_error', function(event) {
console.log('Async partial could not load in this container:', event.container);
});
👁 Making DOM element available in events
As you've seen in the previous example, you can now access event.container
which will give you the associated DOM element. DOM element will be the one it just got replaced after the request has finished.
🔨 Fix of #90
Toggle event listeners are not added after the page has loaded.
Note
If you're using jQuery to trigger an event like so
$(document).ready(function(){
$("#render-async-trigger").trigger('click');
});
Make sure you're using render_async with jQuery configuration set to true!
OR
If you're using it with Vanilla JS (as is, as installed), make sure to register these events after the DOMContentLoaded
is fired!