https://htmx.org logo
Powered by
# htmx-general
  • r
    Hey gang. I have a question around how swapping interacts with hx-trigger. Currently, I have two elements. One button is always on the page. The other one can either be on the page from pageload or be swapped in with 
    hx-swap-oob='true'
    based on a user action afterwards.  I want the second button to trigger the same HTMX request as the first one. Currently, I am doing 
    hx-trigger=click, click from:#second-button
    . This works fine when the second button is there from the start, but when the second button is swapped in OOB, it doesn’t seem to have the event handler added. Is that expected? Does anyone any suggestions for a workaround?
  • h
    you could use a body event have the buttons throw the same event
  • h
    something like 
    hx-trigger="my-custom-event from:body
  • r
    Would I have to use some custom JS to make the 
    click
    event from those buttons trigger the 
    custom-event
    ?
  • h
    yeah
  • h
    something like
  • h
    <button onclick="this.dispatchEvent(new CustomEvent('foo'));">
  • h
    in alpine it would be like
  • h
    <button  @click.prevent="$dispatch('my-event')">
  • c
    @mysterious-toddler-20573 done (https://github.com/bigskysoftware/htmx/pull/949)
  • r
    Ah that's great @hundreds-camera-24900 thanks so much!
  • b
    Please can someone point me in the right direction for submitting a form without a button (but keeping it accessible). We need the form to submit only once the user has been able to see the options and either hit enter or clicked on their chosen option, not while they’re toggling through the options
  • b
    Current stripped back example: 5 10
  • b
    Thought it might be: hx-trigger=“keyup[key==‘Enter’], clicked” (or similar) on each of the options but that didn’t seem to work
  • s
    I'm just learning myself, but from reading the doc you may want the 
    change
    event: > The change event is fired for , , and elements when an alteration to the element's value is committed by the user. Unlike the input event, the change event is not necessarily fired for each alteration to an element's value.
  • b
    Thanks @steep-lamp-42308 - I did try different combinations of change & changed etc in different places but wasn’t quite what we needed
  • b
    I actually think the example I posted does exactly what we want now I’m revisiting it 🤦‍♂️
  • s
    Hi all, we're building a page that polls every 1s to check if a background process has completed. While it hasn't the page renders a bootstrap spinner. It all works great, except the animation of the spinner restarts every time the polling happens. Any ideas how to fix that? I've set the spinner with a unique id and a 
    hx-preserve
    to no help
  • s
    Copy code
    <div hx-get="my-url"
    hx-trigger="load delay:1s"
    hx-swap="#step"
>
<div class="d-flex justify-content-center">
  <div class="spinner-border" hx-preserve id="asdf" role="status">
  </div>
</div>
</div>
  • m
    hx-preserve="true" might be needed
  • s
    tried that too 😦
  • m
    hmmm
  • m
    I wonder if swapping the spinner into the new content resets its animation too
  • m
    Another option: have the poll return a 
    204 No Content
    until things are complete
  • s
    oh interesting, will that result in the delay:1s to trigger again?
  • m
    it should
  • m
    htmx should just ignore the response content in this case
  • m
    fair warning: I am old and tired, but I think that works
  • s
    let me try it real quick... 🙂
  • s
    sadly, no. It gets a 204 and then it never triggers another get
1...719720721...1146Latest