https://htmx.org logo
Join Discord
Powered by
# htmx-general
  • m
    wait a sec
  • m
    without this you can't append multiple elements
  • m
    🤔
  • m
    htmxhtmx.js at 1aafebb0dae2b645c9a03469...
  • m
    @ancient-shoe-86801 can I ask you to contribute docs on the cache issue you looked into? Maybe in the request section?
  • a
    Sure, will send a PR.
  • m
    thank you, sorry to give you work!
  • a
    no prob, I should have done that from the beginning 🙂
  • h
  • h
    how do you stop a form from being submitted when the enter button is pressed? i have an inline validation request on the input which returns a oob-swapped submit button with disabled=true, but pressing enter still submits the form and the invalid request goes through
  • m
    You'll need to intercept the 
    submit
    event on the 
    <form>
    element and 
    preventDefault();
    on it, I believe. In that event listener, you could check for your 
    type="submit"
    children and see if they're disabled, and use that information to decide whether to 
    preventDefault
    or not. Another option would be to respond to the 
    htmx:oobAfterSettle
    [sic] event and set the whole 
    <form>
    as 
    disabled
    (or not-disabled) based on the oob-swapped submit button's disablement. (I forget what the specific oob after settle event name is in HTMX but it's something like that.)
  • m
    If the form is `hx-trigger`ed by 
    submit
    , you may even be able to express the above logic in a 
    [filter]
    on the 
    hx-trigger
    expression, though you may have to ask someone more familiar with that syntax how that'd be possible (@mysterious-toddler-20573?)
  • h
    thanks, yeah i was trying to avoid writing a custom handler in case there was something built in that could take over.. like a filter
  • b
    hi all! I'm new to this server and I thought I'd introduce myself here. I've been learning htmx (and published it in a series of youtube videos) and now I'm working on an educational game using htmx and flask
  • c
    This is awesome! I've been playing with this. This is awesome for better Q&A type questions.
  • m
    are you interested in setting it up for this discord?
  • c
    @mysterious-toddler-20573 yeah I thought that would be cool :).
  • m
    welcome alex! maybe post your stuff to #909436816388669530 ?
  • h
  • h
    I guess asked in a more global way: if I want a fragment to have it's own js/css libs what's the best way to delay swap until the loading has happened
  • h
    so I can EG include a modal libary, load the modal css and then swap the modal in so I don't get a FOUC
  • m
    I could see doing it as a callback after the lib loads, assuming there is a hook
  • m
    I tend to load all JS up front though to avoid the issue 😑
  • h
    yeah that's how I'm doing it rn
  • m
    "load it all, let the cache sort it out"
  • h
    I think I can figure something out smart w/ preloading?
  • h
    separate out the extra libs and add a preload step in the base template
  • f
    Hey all, the Sortable example at causes a 
    htmx:targetError
    on my end, here's the markup:
    Copy code
    <table class="table table-light" hx-target="closest tr" hx-swap="outerHTML">
    <tbody class="sortable" hx-post="/items" hx-trigger="end">
        <tr>...</tr>
        <tr>...</tr>
    </tbody>
</table>
<div class="htmx-indicator">
    Updating...
</div>
    Console:
    Copy code
    elt: tbody.sortable
error: "htmx:targetError"
target: null
    How can I find out more about this error?
  • m
    that indicates that the target isn't available
  • f
    Yes, the example also has no target specified 
    <form class="sortable" hx-post="/items" hx-trigger="end">
1...826827828...1146Latest