https://htmx.org logo
Powered by
# htmx-general
  • h
    do people have opinions the best vanilla JS widgets to use for ux improvements? EG Datepicker, filepond/dropzone for file upload, ??? for image cropping, tom-select for select?
  • h
    I know that's sort of outside the scope of htmx but w/ dropping react I need to find new default answers to those situations
  • h
    Also different question - does htmx right now have any support for preloading like on hover?
  • h
    I appreciate I might have just opened myself up to a rule 7b call
  • h
  • h
    something like https://htmx.org/extensions/preload/ I guess lol
  • a
    Hey @mysterious-toddler-20573 what did I miss? https://twitter.com/htmx_org/status/1468338131518869504?s=21
  • g
    Hey guys. I have a div whose hx-get I set dynamically, from another div, and then trigger an event. The event is triggered and thr get request goes to server and response comes back perfectly what I want. I can see the response in the chrome dev tools. BUT the hx-swap='outerHTML" is not taking effect. Nothing is happening on the page
  • g
    Any ideas?
  • g
    Copy code
    <div id="staff_permissions" class="ml-4 mt-4 p-4 bg-gray-100" hx-trigger="mychange" hx-swap="outerHTML" hx-target="this"></div>
  • g
    This div's hx-get is set dynamically and reposne comes back fine but swap does not take place.
  • g
    Hold on, something else is happening here. The request was actually being issued by a former jquery script on the page. After removing it, I see the request os not being issued. Need to explore further.
  • r
    Reddit up to their old tricks again....
  • m
    Maybe try running 
    htmx.process()
    https://htmx.org/api/#process after you add the attribute?
  • m
    There's a preload extension that might help https://htmx.org/extensions/preload/
  • g
    How do we raise a custom event? Is it simply 
    trigger mycustomevent
    in hyperscript? or do we have to define the event somewhere first? In a separate code at one place I am triggering 
    response["hx-trigger"] = "note_success"
    and that triggers client side event all fine.
  • m
    trigger myEvent
    is valid hyperscript
  • g
    I see. Then Ill have to dig deeper.
  • g
  • g
    correct me if i'm wrong, but it seems like most of the bullet points here also apply to htmx+_hs
  • g
    > **Seamless client-server code**: ... so easy to move between the two within the same file ... > Progressive enhancement: ... #useThePlatform ... work without JavaScript ... > Simple mutations: ... just uses the platform 
    <form />
    ... > Normalized platforms: ... So whether you want to deploy to ... it doesn’t matter ...
  • g
    How do I use htmx.process(). Can this be inside the hyperscript itself, just after the attribute addition?
  • g
    Yes. Just say 
    call htmx.process(node)
    in your hyperscript.
  • g
    I got this as the first error in dev console:
    Copy code
    Cannot read properties of undefined (reading 'htmx-internal-data')
e.meta.reject    @    hyperscript.org@0.9.1:1
k    @    hyperscript.org@0.9.1:1
a.execute    @    hyperscript.org@0.9.1:1
execute    @    hyperscript.org@0.9.1:1
a    @    hyperscript.org@0.9.1:1
ListPicker._handleMouseUp    @    unknown
  • g
    The 
    node
    variable will need to point to an actual DOM node. Perhaps you’re using something invalid in there? If not, try posting the code you’re using that’s generating the error 😀
  • g
    🙂 Oh okay. I understand now. But can you please give me a simple example of how to go about using this? Ill then try to adapt it.
  • g
    Do you mean you a css selector like: htmx.process('#mydiv')
  • g
    Yes, but I think you need to evaluate the selector first, so you’ve got a reference to the node, and not just a string.
  • g
    Ah! document.getElementById()
  • g
    I can't find what's wrong. Here is my code if you can have a look please: https://pastebin.com/SVJVNSqr
1...455456457...1146Latest