Triggering multiple api calls in HTMX
I am a big fan of htmx and use it in a lot of my projects. I recently had a use case where I needed to trigger multiple api calls in a single htmx request. I was able to do this by using the hx-trigger attribute. <html> <head> <script src="https://unpkg.com/htmx.org@1.9.2" integrity="sha384-L6OqL9pRWyyFU3+/bjdSri+iIphTN/bvYyM37tICVyOJkWZLpP2vGn6VUEXgzg6h" crossorigin="anonymous"></script> </head> <body> <input id="input-box" type="text" placeholder="Enter your input and press Enter" name="name"> <div hx-get="/api/call1" hx-trigger="keyup delay:200ms from:#input-box"> </div> <div hx-get="/api/call2" hx-trigger="keyup delay:200ms from:#input-box"> </div> <div hx-get="/api/call3" hx-trigger="keyup delay:200ms from:#input-box"> </div> </body> </html> The idea is to listen to the keyup event on the input box and trigger the api calls after a delay of 200ms....