htmx/www/content/extensions/disable-element.md
2024-04-17 10:48:55 -06:00

1.0 KiB

+++ title = "disable-element" +++

NOTE: This extensions functionality has been folded into the core of htmx via the hx-disabled-elt attribute

This extension disables an element during an htmx request, when configured on the element triggering the request.

Install

<script src="https://unpkg.com/htmx.org@1.9.12/dist/ext/disable-element.js"></script>

Usage

Nominal case: disabling the element triggering the request

<button hx-get="/whatever" hx-ext="disable-element" hx-disable-element="self">Click me</button>

Disabling another element

<button hx-get="/whatever" hx-ext="disable-element" hx-disable-element="#to-disable">Click me</button>
<button id="to-disable">Watch me being disabled</button>

Disabling multiple elements

<button hx-get="/whatever" hx-ext="disable-element" hx-disable-element=".to-disable">Click me</button>
<button class="to-disable">Watch me being disabled</button>
<button class="to-disable">Watch me being disabled also</button>