https://htmx.org logo
Join Discord
Powered by
# htmx-general
  • b
  • b
    no, it was a blog post by some european guy...
  • e
    Imagine we have a scenario A uesr is on version 1.1
    Copy code
    html
  # version 1.1
  <div>
    Click and see a RED button
    <button hx-get="/click" hx-trigger="click" hx-swap="outerHTML">
      A button
    </button>
  </div>

  # url /click returns
  <button hx-get="/click" hx-swap="outerHTML" style="color: red">
    I am red
  </button>
    Later, a new version 1.2 has been release to public
    Copy code
    html
  # version 1.2
  <div>
    Click and see a Blue button
    <button hx-get="/click" hx-trigger="click" hx-swap="outerHTML">
      A button
    </button>
  </div>

  # url /click returns
  <button hx-get="/click" hx-swap="outerHTML" style="color: blue">
    I am blue
  </button>
    The user who is on 1.1 cicked the button and the blue button(version 1.2) is sent and resulted in the wrong expectation. How would we overcome this problem?
  • b
    You could have a version in the cookie, and if the version differs btwn request and response, force a full refresh on the client
  • e
    That is an option. However, while the the particular browser tab is stayed on v1.1 and he opens a new tab, the cookie get updated. Then the user goes back to the original 1.1 tab, I believe the version in the cookie and the response will just match?
  • e
    I believe store the current version in a JS var will be better
  • b
    Ya both, another place for a mismatch
  • e
    I am still thinking about the approach of force reloading. If that happens in a ui modal or form, it will pretty annoying to user.
  • b
    Ya I mean this is a problem w any server/client relationship, not anything specific to htmx or hotw
  • e
    yes, I am just wondering if htmx offers magic to this as well.
  • v
    in the Stacks it would be good to add ASTRO
  • v
    astro.build
  • m
    An option is to keep a version cookie and check that at the start of every request, and, if the client is out of date, use a response header to trigger an event telling the client to reload (or just hard reload, according to tastes)
  • b
    One thing on 
    head-support
    , I noticed there’s a 
    <style>
    tag that gets added for 
    .htmx-indicator
    which seems to be dynamically added. If I mark all of the 
    <head>
    contents with 
    hx-preserve=“true”
    , that 
    <style>
    tag gets removed the first time a head swap occurs. That’s as expected, but may not be what someone wants. Makes me wonder if there should be a way to default everything to 
    hx-preserve=“true”
    prior to any head swaps, and allow setting 
    hx-preserve=“false”
    (or similar) so that the page-specific stuff that got swapped into head doesn’t remain after subsequent head swaps.
  • m
    mmmm
  • m
    good point
  • m
    I'll think more
  • s
    I got a message from someone new to htmx and new to web development. AFAIK plattforms like jsfiddle don't work well for htmx, because you need to create snippets-responses, which is (AFAIK) not supported by jsfiddle-like services. But maybe I just don't know this cool plattform yet where you can edit htmx and have an extra tab to create responses, so that you can create self-containing examples which you can use for non-abstract discussions about code.
  • r
  • r
    This will work on js fiddle, codepen, anywhere
  • r
    It's not perfect, htmx extensions may not work, it's a known problem, but for most cases this script is perfect
  • s
    thank you. And I learned about the 
    output
    tag. Never seen it before. Thank you.
  • b
    Hi
  • b
    What is the purpose of HX-Request as the doc is not clear enough for me ?
  • t
    It tells the server that the request came from htmx
  • b
    ok. So we can populate a response which is different depending if htmx is in the loop or not
  • i
    Hey all, I'm wondering if it's possible to use hx-confirm in conjunction with hx-trigger delay like so:
    Copy code
    html
<form 
    hx-post="/some-url"
    hx-confirm="Are you sure you want to do the action?"
    hx-trigger="confirm delay:500ms"
>
  <button>Do Action</button>
</form>
    I'm trying to get the delay to be after the confirm message has been OK'd, but I'm not having any luck with it. Any help would be appreciated 🙂
  • b
    Why is HTMX expecting to get HTML and not JSON ?
  • b
    Is it planned that HTMX will support JSON as response output ?
  • m
    because html is the entire point?
1...869870871...1146Latest