itsscb/htmx
1
0
Fork 0
mirror of https://github.com/bigskysoftware/htmx.git synced 2025-10-03 07:45:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

docs on hx-preserve

Browse Source
This commit is contained in:
carson 2021-02-01 10:25:51 -07:00
parent 08d594ccf3
commit 6d65d078e7
3 changed files with 10 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
www/attributes/hx-preserve.md
View File

@ -5,7 +5,8 @@ title: </> htmx - hx-preserve
## `hx-preserve` ## `hx-preserve`
The `hx-preserve` attribute allows you to keep a section of content unchanged between HTML replacement. When hx-preserve is set to `true`, an element is preserved (by id) even if the surrounding HTML is updated by htmx. The `hx-preserve` attribute allows you to keep a section of content unchanged between HTML replacement. When hx-preserve is set to `true`, an element is preserved (by id) even if the surrounding HTML is updated by htmx. An element *must* have an `id` to be preserved
properly.
Here is an example of a youtube embed, which would be unaffected an htmx request: Here is an example of a youtube embed, which would be unaffected an htmx request:
@ -17,4 +18,4 @@ Here is an example of a youtube embed, which would be unaffected an htmx request
### Notes ### Notes
* `hx-select` is not inherited * `hx-preserve` is not inherited

6
www/docs.md
View File

@ -411,6 +411,12 @@ Note that out of band elements must be in the top level of the response, and not
If you want to select a subset of the response HTML to swap into the target, you can use the [hx-select](/attributes/hx-select) If you want to select a subset of the response HTML to swap into the target, you can use the [hx-select](/attributes/hx-select)
attribute, which takes a CSS selector and selects the matching elements from the response. attribute, which takes a CSS selector and selects the matching elements from the response.
#### Preserving Content During A Swap
If there is content that you wish to be preserved across swaps (e.g. a video player that you wish to remain playing
even if a swap occurs) you can use the [hx-preserve](/attributes/hx-preserve)
attribute on the elements you wish to be preserved.
### <a name="parameters"></a> [Parameters](#parameters) ### <a name="parameters"></a> [Parameters](#parameters)
By default, an element that causes a request will include its value if it has one. If the element is a form it By default, an element that causes a request will include its value if it has one. If the element is a form it

1
www/reference.md
View File

@ -32,6 +32,7 @@ title: </> htmx - Attributes
| [`hx-params`](/attributes/hx-params) | filters the parameters that will be submitted with a request | [`hx-params`](/attributes/hx-params) | filters the parameters that will be submitted with a request
| [`hx-patch`](/attributes/hx-patch) | issues a `PATCH` to the specified URL | [`hx-patch`](/attributes/hx-patch) | issues a `PATCH` to the specified URL
| [`hx-post`](/attributes/hx-post) | issues a `POST` to the specified URL | [`hx-post`](/attributes/hx-post) | issues a `POST` to the specified URL
| [`hx-preserve`](/attributes/hx-preserve) | preserves an element between requests
| [`hx-prompt`](/attributes/hx-prompt) | shows a prompt before submitting a request | [`hx-prompt`](/attributes/hx-prompt) | shows a prompt before submitting a request
| [`hx-push-url`](/attributes/hx-push-url) | pushes the URL into the location bar, creating a new history entry | [`hx-push-url`](/attributes/hx-push-url) | pushes the URL into the location bar, creating a new history entry
| [`hx-put`](/attributes/hx-put) | issues a `PUT` to the specified URL | [`hx-put`](/attributes/hx-put) | issues a `PUT` to the specified URL