HTMX hx-trigger attribute (allows you to specify what triggers an AJAX request)


The hx-trigger attribute allows you to specify what triggers an AJAX request.

A trigger value can be one of the following:

  • An event name (e.g. “click” or “my-custom-event”) followed by an event filter and a set of event modifiers

  • A polling definition of the form every <timing declaration>

  • A comma-separated list of such events

Standard Events

A standard event, such as click can be specified as the trigger like so:

<div hx-get="/clicked" hx-trigger="click">Click Me</div>


hx-trigger is inherited and can be placed on a parent element.


hx-trigger=’load’ pattern by Carston Gross

mmm, yes, interesting. that particular feature was a good example of something that htmx has offered since the start via the hx-trigger=’load’ pattern, and it definitely breaks progressive enhancement.

(As an aside, intercooler.js has had this feature for a decade now: )

Yes exactly. I just wanted to mitigate a little bit when people say that Hotwire/Turbo is full batteries-included and full progressive enhancement. That’s just not the case. There a multiple features in Turbo that need JavaScript to me.