htmx: Triggers

Join the AI Workshop to learn more about AI and how it can be applied to web development. Next cohort February 1st, 2026

The AI-first Web Development BOOTCAMP cohort starts February 24th, 2026. 10 weeks of intensive training and hands-on projects.


Requests can be triggered in different ways.

The default is click, but you can fire a requests upon any browser-generated event, like mouseenter or keyup or even a specific keypress.

You do that using hx-trigger:

<button 
  hx-get='/data' 
  hx-swap='innerHTML' 
  hx-target='#data'
  hx-trigger='mouseenter'>
  Load fresh data
</button>

It doesn’t have to be an event.

htmx offers other ways to fire events, like polling. Use every 5s to fire a GET request every 5 seconds: hx-trigger='every 5s'

Or use load to load just once after 10 seconds: hx-trigger='load delay:10s'

Lessons in this unit:

0: Introduction
1: Why htmx
2: The core idea of htmx
3: Installing htmx
4: Doing a GET request
5: Swap
6: POST request
7: Targets
8: Loading indicator
9: Confirming actions, and prompts
10: ▶︎ Triggers
11: Request headers
12: Response headers
13: Events
14: Redirect after request
15: Send files using htmx.ajax()
16: Perform something on page load
17: Conditionally hide HTML elements based on HTMX request status
18: htmx + Alpine template tag
19: htmx, include hidden input fields outside of a form
20: htmx trigger request via JS event