bigskysoftware / bigskysoftware/htmx

Exposing saveCurrentPageToHistory via js API

Open
#2,825 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
49.4k
Forks
1.7k
Avg merge
3d 22h
Merged PRs (30d)
30

Description

When working with boosted error responses like e.g. in Laravel it can occur that there is a custom error page with custom head tags which have nothing to do with my htmx-powered application. This site is totally different and it is not enough to "just" swap the body.
I solved this using the following code:
```js
document.body.addEventListener('htmx:beforeOnLoad', function (evt) {
if (evt.detail.xhr.status >= 400) {
htmx.saveCurrentPageToHistory()
document.location = evt.detail.xhr.responseURL;
let iframe = document.createElement('iframe');
document.getElementById('htmx-error-modal-content').appendChild(iframe);
iframe.src = 'about:blank';
iframe.contentWindow.document.open();
iframe.contentWindow.document.write(evt.detail.xhr.responseText);
iframe.contentWindow.document.close();
document.getElementById('htmx-error-modal-backdrop').style.display = 'block';
}
});
```

Without the exported `htmx.saveCurrentPageToHistory()` the forward/backward buttons would not work properly. Therefore, I propose to add it to the exported functions.

Thank you in advance

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.