https://htmx.org logo
Powered by
# htmx-general
  • b
    also 
    textual
    for the full TUI experience (by the same 
    rich
    guy)
  • p
    Will McGugan => https://twitter.com/willmcgugan (Author of Rich, Textual, and PyFilesystem Python packages)
  • b
    That’s the fella.
  • l
    Hello! Hope it's OK to ask questions about using HTMX here (I don't see a #help channel or anything). How would I create a 
    <input type="checkbox" name="foo" />
    that issues a 
    POST
    to a given URL on toggle, and also contains the state of the checkbox? Just adding 
    hx-post
    on the 
    <input>
    doesn't seem to include its value
  • l
    Should I wrap it in a 
    <form>
    and use 
    hx-post
    on the form with 
    from:find input
    or something?
  • l
    > By default, an element that causes a request will include its value if it has one. Hmm, I wonder why I'm not seeing that
  • m
    Does the checkbox have a name?
  • l
    It does
  • l
    Putting it in a 
    <form>
    seems to have done the job though (with no other changes)
  • m
    Hmm that sounds like a bug
  • m
    Can you create a GitHub issue for it?
  • l
    Will do! I've made a note to put together a minimal repro first. If what I'm doing is meant to work, I might have messed something else up
  • b
    Do you get a value sent if the checkbox is checked? I think that if they are not checked then they are not sent to the server
  • b
    as in: the HTML spec says not to send them. (not htmx)
  • l
    Yea, I did actually just witness that when I had it in a 
    <form>
    and forgot about that behavior. So possible that I didn't actually check a checked request
  • l
    I'll double check that now
  • l
  • n
    I had to write a bunch of JavaScript to make not writing client-side JavaScript (using HTMX) more ergonomic. Made a simple JSX to string (with proper escaping) library. Using functional components on the server side es much more nice than using template partials with Handlebars.
  • n
    We are using TypeScript on the server so now our templates are type checked 😄
  • n
    This feels like the best solution for JS/TS teams trying to adopt HTMX. You get the familiar and powerful component model of the client-side frameworks (React, Vue, Svelte, Ember) with HTML over the wire and getting islands of updatable content with HTMX and other simple interactions with Alpine or hyperscript.
  • n
    Here's a little example. As you can see everything is a component that can be rendered in isolation so when you need to send a small piece of HTML over the wire for an HTMX update, it is very likely that you already have a component defined for just that part of the UI.
    c
    • 2
    • 4
  • b
    Was the form value sent when the box was checked?
  • l
    I tried again and with no form everything is working as expected. So who knows wtf I was doing before
  • l
    So tl;dr: wasted all your time. Sorry bout that! 😅
  • a
    I need to make an autocomplete which pulls from an external api via a GET. Is htmx suitable for this?
  • l
    htmx is mostly about serving HTML from servers and smushing it into the DOM. I imagine your external API is giving you back something more like JSON, in which case it might be a bit of work - maybe more suited to hyperscript
  • a
    yes correct it would be a JSON response. I looked in to Vue, React, Angular, SemanticUI. Have not looked in to Hyperscript yet.
  • b
    You can do client-side templates to process JSON responses: https://htmx.org/extensions/client-side-templates/
  • b
    Not sure about its status though - I think there was some talk about a rewrite or dropping support? (Or I'm just imagining that.)
  • m
    You can also make a call to your own server to retrieve the data from the API, process it using it a server-side template, then send back the HTML.
1...544545546...1146Latest