This event is emitted when the server responds with the HTML, before the HTML is used to change a fragment.
Event listeners may call event.preventDefault()
on an up:fragment:loaded
event
to prevent any changes to the DOM and browser history. This is useful to detect
an entirely different page layout (like a maintenance page or fatal server error)
which should be open with a full page load:
up.on('up:fragment:loaded', (event) => {
let isMaintenancePage = event.response.getHeader('X-Maintenance')
if (isMaintenancePage) {
// Prevent the fragment update and don't update browser history
event.preventDefault()
// Make a full page load for the same request.
event.request.loadPage()
}
})
Instead of preventing the update, listeners may also access the event.renderOptions
object
to mutate options to the up.render()
call that will process the server response.
Event listeners may call this method to prevent the fragment change.
The original request to the server.
The server response.
The link or form element that caused the fragment update.
Options for the up.render()
call that will process the server response.