Атрибут hx-preserve

Атрибут hx-preserve позволяет сохранить элемент неизменным при замене HTML. Элементы с установленным hx-preserve сохраняются по id, когда htmx обновляет любой родительский элемент. Вы должны установить неизменяемый id на элементах, чтобы hx-preserve работал. Ответ должен содержать элемент с тем же id, но его тип и другие атрибуты игнорируются.

Примечания

• hx-preserve не наследуется.
• Вы можете использовать hx-preserve="true" или просто использовать его как булевый атрибут с hx-preserve.
• Некоторые элементы не могут быть должным образом сохранены, например, <input type="text"> (положение фокуса и курсора теряется), iframes или некоторые виды видео. Для решения некоторых из этих случаев рекомендуется использовать расширение morphdom, которое выполняет более сложное согласование DOM.
• При использовании поддержки истории для действий, таких как кнопка «назад», элементы с hx-preserve также будут сохранять свое состояние.
• Избегайте использования hx-swap с параметром none с запросами, которые могут содержать элемент hx-preserve, чтобы избежать его потери.
• hx-preserve может привести к тому, что элементы будут удалены из своего текущего положения и перемещены в новое место при замене части содержимого/внеплановой замены.

<div id="new_location">
  Просто переместили видео сюда
  <div id="video" hx-preserve></div>
</div>

• Может быть использовано внутри содержимого элемента hx-swap-oob.

<div id="notify" hx-swap-oob="true">
  Уведомление обновлено, но сохраняет тот же идентификатор
  <div id="retain" hx-preserve></div>
</div>