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 |