https://htmx.org logo
Powered by
# htmx-general
  • g
    Gotcha. It makes sense that we'd need a global variable.
  • g
    you might be able to use a data attribute
  • g
    We had a similar issue with a video that was embedded within an iframe. Our solution was to keep that outside the rest of the dom that was being replaced. We use boost but not on the body element but on a child element so we can keep boosted content separate from the video.
  • g
    So that branch is the one that can load remote files? I'll try merging that into my dev branch for now. Thanks!
  • g
    note that you need to put the hs scripts before loading hyperscript itself
  • g
    (Shoot. I'm in the wrong board again. Time to put another dollar in the jar)
  • p
    did you try hx-preserve or did you have the same issue?
  • g
    We did try hx-preserve but that doesn't work for iframes at least. The iframe is reloaded if you move it around in the dom. Seems like that is inherent in how iframes work.
  • p
    yeah I just have the audio element in the body (no iframe).
  • p
    one workaround is using an Audio object instead (the player controls are pure HTML) but that brings its own issues
  • g
    I have no experience on how they work and it seems like turbo has solved it as you pointed out. So perhaps there is a way to make it work with htmx as well
  • p
    yes, it was raised as an issue with turbo: I think they fixed it using replaceWith or similar (don't recall the exact details). Re hx-boost: does that not just swap out the entire body anyway?
  • g
    you can target other elements than the body with boost.
  • g
  • g
    I started looking into this issue as I would like to move one of our internal libraries to be an htmx extension but it's a bit tricky as the current swapping code is pretty bound to the ajax stuff. Anyone that has taken a stab at it?
  • p
    so re hx-boost: suppose I have a sidebar & want to target a separate content area - I set hx-boost="true" on the sidebar along with hx-target="#content" ?
  • p
    I'm a bit confused by the docs: if you set hx-boost="true" on an element, it swaps out just that element's innerHTML, not the body?
  • p
    or do you need to explicitly set hx-target="#some-element"?
  • p
    are there some other examples around? I think the docs don't have much info on usage
  • p
    " The target is the tag, and the innerHTML swap strategy is used by default. All of these can be modified by using the appropriate attributes, except the click trigger."
  • p
    so if I add hx-target along with hx-boost I get a swap error, so that doesn't work. No idea what other "appropriate attributes" might be
  • m
    hx-target should override hx-boost
  • g
    this is basically our main layout:
  • g
    main content that will be be replaced by boost here.. Other content that will not be replaced here
  • g
    so every link on the page will be boosted by default. And it will replace the js-boost-target div with the content in that same div we get from the server
  • g
    hx-target sets which element that is going to be replaced. hx-select selects which part of the server response that should replace the target
  • p
    ah hx-select
  • p
    hmm. Just tried that and got swap error
  • p
    <body class="" hx-boost="true" hx-select="#content" hx-target="#content" hx-swap="outerHTML">
  • p
1...242243244...1146Latest