hyperscript

what of it

it's good

we're intergalactic now, folks: https://www.reddit.com/r/htmx/comments/qhgwkx/comment/hieg8mm/?utm_source=reddit&utm_medium=web2x&context=3

How do I redirect without refreshing the entire page? What I'm trying to do is have a form that submits, to an endpoint, which will validate it. If it is invalid, it returns the form with the error message. If it is valid, I want it to go to a different page. I tried using

HX-Redirect

but that causes a full screen refresh, which I'd like to avoid if possible

Have you tried responding with an event (hx-trigger header) that your website can use to load a new page?

The mechanics will vary depending on your architecture, but I'd start with something like that.

That does seem like it would work, though I'd like to avoid writing custom JS if possible. What I'm really looking for is a redirect that acts like

hx-boost

, where the path just causes an AJAX request that swaps/targets the body (and also pushes to the history properly)

Also I might be stupid - I don't think a full refresh of the page actually happens, but I also can't really tell 😅

extension idea: https://bradgessler.com/articles/419-never-gonna-give-you-up/

Probably the easiest is to respond with an oob swap targeting the body and a

HX-Push-Url

response header

well I'm trying that but can't quite seem to get the OOB swap to work on the body, hm EDIT: jk I was returning the entire page by accident

https://www.loom.com/share/dffdf15baa3045ea9eea562bd88cc1b3?sharedAppSource=personal_library HIGHLY RECOMMEND WATCHING THE LOOM AT 1.5 ~ 2 times speed. I talk slow. Skip to the 58 minute mark to see

lucid-htmx

immediately. Watch the rest if you're interested in Haskell web dev.

An overview of

lucid-htmx

. I've recently published the package to hackage, the Haskell package manager. Check it out here: https://hackage.haskell.org/package/lucid-htmx Documentation here: https://hackage.haskell.org/package/lucid-htmx-0.1.0.0/docs/Lucid-HTMX.html I recommend watching the loom video at 1.5 ~ 2 times speed. I talk slow and the video is long but watching it at a higher speed, I think it's a good pace. If you want to skip straight to the htmx stuff, skip to the 58 minute mark. Otherwise, I take a dive into web dev in Haskell and answer some interesting questions like how to query a database in Haskell, how to implement a server in Haskell, and what are some annoying things about Haskell development.

Code for the example in the loom video can be found here: https://github.com/rashadg1030/haskell-htmx-examples/blob/main/app/Main.hs

I'm going to work on a way to make it easy for people to run the example on their machine. If you have stack, you can just clone the repo and run

stack build

at the root of the folder.

Issue is here: https://github.com/bigskysoftware/htmx/issues/635

Also, the documentation for the beforeSwap event has a duplicate entry for detail.target, pull request submitted

Great work (once again) @User!! One small correction, if I may. "Ryan Irelan" should read as "Chris Fer­di­nan­di" (and "RI" with "CF").

Voices are hard... Thanks, fixed.

Thanks!

Since you're here @User, I have an idea to share: a htmx devtools browser extension. This could log requests in its own devtools window, including things such as the request params and headers, response time and payload, as well as a visual overlay of the swapped mark-up in the browser window. Kind of similar to the request viewer on the htmx examples pages, but as a browser extension. VueJS has a very powerful devtool browser extension, for example, see the quick demo at

Has this idea come up before, and what do you think?

It does in F# - https://fsprojects.github.io/FSharp.Data/library/HtmlProvider.html

https://discord.com/channels/725789699527933952/725789747212976259/902928361951727667 It was discussed before, and I think it's a wonderful idea. I bet we could implement a time-travel debugger like Redux, for the framework war coolness points...

I'll stop talking about this before it gets assigned to me

Too late

There is a question on stackoverflow and I think htmx is perfect for the use case. I pointed this person to use

hx-trigger="delay:1000ms"

to get content periodically, but it does not seem to work. If there is anybody that has a clue why that might be, feel free to comment on my answer at https://stackoverflow.com/questions/69740440/updating-an-html-data-table-using-thymeleaf-java-and-spring-mvc/69750735

> By using the syntax every you can have an element poll periodically: >

html
> <div hx-get="/latest_updates" hx-trigger="every 1s">
>   Nothing Yet!
> </div>
>

https://htmx.org/attributes/hx-trigger/

Thanks! Is

delay:1s

a one time thing maybe?