mirror of
https://github.com/bigskysoftware/htmx.git
synced 2025-09-27 21:13:31 +00:00
docs on hx-preserve
This commit is contained in:
parent
08d594ccf3
commit
6d65d078e7
@ -5,7 +5,8 @@ title: </> htmx - 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:
|
||||
|
||||
@ -17,4 +18,4 @@ Here is an example of a youtube embed, which would be unaffected an htmx request
|
||||
|
||||
### Notes
|
||||
|
||||
* `hx-select` is not inherited
|
||||
* `hx-preserve` is not inherited
|
||||
|
@ -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)
|
||||
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)
|
||||
|
||||
By default, an element that causes a request will include its value if it has one. If the element is a form it
|
||||
|
@ -32,6 +32,7 @@ title: </> htmx - Attributes
|
||||
| [`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-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-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
|
||||
|
Loading…
x
Reference in New Issue
Block a user