maybe 6em?

Also might be nice to have a slight-gray background for the pre blocks to make them stand out a bit

not so dark, but you get the point

done!

beauty, I will pull now

this is good

it looks good from far away

print it out and post it anonymously on the doors of ThoughtWorks, with a hammer

Looks great, @User !

If only there was a better acronym…

our previous discussion on the topic of acronyms

I like this twitter thread: https://twitter.com/htmx_org/status/1402387962894057476

@mysterious-toddler-20573 The issue I was having with the back button was "magically" resolved when I moved the script tags from the bottom of the body tag into the head tag. I'm not sure if this is a known side effect and or if its documented.

someone posted the HATEOAS article to the orange site, it's on new if people want to upboat

https://htmx.org/essays/hateoas/ in the overdrawn example, the account still has positive balance

https://ti.to/defna/djangocon-us-2021 next weekend is Django Conference US. AFAIK there will be three talks which are about htmx. It's free, but you need to register soon (today or tomorrow). See us there

Many people new to htmx seem to struggle with redirects. It was the same for me. If you did old-school web development in the past, then you used the post/redirect/get pattern. This is common in the django world. If you set the hx-redirect http header in a response and the http status is 302, AFAIK htmx does first fetch the content from the new URL and ignores the hx-redirect http header. Where in the docs would be a good place to make people aware of this?

It would probably be good to add a section on this topic to the /www/docs.md file

Thank you for noticing, I have pushed a correction

Hi. this is more of a general question, and probably a very basic one, on how to think of, and convert, JS code once HTMX is added to a more 'traditional' site (in which each page is loaded anew without any Ajax). In that original site, I have a main JS class file that imports other utilities, and takes care of the UX interactions. Between each page load the class is initiated anew since we are beginning from a blank slate. Everything works fine. But now, that I have converted the site into, pretty much, a SPA, I am confused on how each newly loaded content can access the functions in the main JS class. I know that the 1st time the site is loaded the class is initiated. But how would I go about accessing utility methods defined in the main JS file. Thank you for any input, and sorry if this is not directly related to the core of HTMX functioning, but It seems to me that HTMX does make us reconsider existing implementation, so hopefully this can be useful to others who are getting started like me.

If the main JS file consists only of utility methods, those should be available on any page as usual. If the problem (more likely) is hooking up event handlers, then the pattern to use is the

htmx.onLoad()

function: https://htmx.org/docs/#3rd-party

htmx will execute this code against the initial page load and then against any partial content added to the page, with the new content being passed into the callback here. By examining the new content only, you ensure that you don't accidentally hook up multiple event handlers on elements in the DOM.

OTOH, if you are adding htmx-enabled content "out of band" (that is, using some other library), then you would need to explicitly initialize the htmx-powered code w/ `htmx.process`:

js
  let myDiv = document.getElementById('my-div')
  fetch('http://example.com/movies.json')
    .then(response => response.text())
    .then(data => { myDiv.innerHTML = data; htmx.process(myDiv); } );

All of this is very helpful. Thank you! I'm going to play around with your suggestions. I feel there's something I'm missing in my understanding, or my approach is a little off, but I'll play around for a few hours. Might knock on your door again!

no prob., if you can post code that might help us help you 🙂

Not sure if this is an orthodox approach, but it works (!). I didn't want to rewrite the original class file I had. So I managed to export it and make it available to the browser –painful hours of trial and error with webpack, but this article (https://dev.to/riversun/recipes-on-how-to-create-a-library-that-supports-both-browser-and-node-js-201m) was a blessing. With that I could create an instance of the main class in the browser. So, in my index.html template file I added this little code right at the beginning of my body tag:

<script>
     const mainUX = new Main();
     console.log(mainUX); // logs the class object
   </script>

What helped me was your mention of the

htmx.onLoad()

method. It made me realize I was missing a general instantiation of the class that could be available everywhere. So, in the htmx loaded partials, I can now invoke methods of the class like this

mainUX.sayHi()

and it produces the expected results. Now, is this too hacky? Is it there a more standard way to do this?

Did you get this resolved?

Working on adding an extension to htmx that will allow to swap response even it's an HttpError(400,500...). As always naming is the biggest issue: accept-error force-swap swap-error allow-httperror allow-error What do you think ?

How would I go about setting up a trigger to fire when another htmx element is done with an hx-swap?