Slightly dumb question perhaps - can the

<script>

reference to htmx be just before the close of the body tag, or any cases it needs to be higher up (in head) ?

Of course you could do everything htmx does with a programming language. But the cool thing is the declarative way. You define what you want and you get it. Why use loops and variables if you can get to the goal more easily in a declarative way?

I include the htmx.min.js before the body close tag. Works fine up to now.

should be able to be at the end

Hi Folks! I'm trying to animate an inline SVG by updating one of its elements, and it works (the DOM gets updated) But somehow the element is not shown after the first update. You could see it in action here: https://app.batlle.ar (debugging or saving the page confirms the update). Anyone able to give me a hand with this?? thanks!

My draft article on how to do asp.net and htmx. It's longer than I expected.

you are in new waters my friend, I have no idea if browsers update SVGs properly when new content is swapped in. You may want to try out the morphdom extension: https://htmx.org/extensions/morphdom-swap/ it does a better job than the default swap strategy of keeping the DOM stable between content swaps.

Thank you for this. And thank you for underlining that the simplest solution has benefits.

That's a super useful new example page!

is there a great YouTube tutorial for htmx?

i don't mean a livestream

like a proper tutorial like the ones travesy media makes

unfortunately not that I'm aware of

a server-side innovation that might interest some of the folks here ☝️

In Django, apparently, there was someone that had some ideas similar to it: https://www.djangosnippets.org/snippets/1302/

More then one person, actually: https://github.com/utapyngo/django-render-partial

You DID IT!! (once again). morphdom-swap extension was the solution. Please, check https://app.batlle.ar/htmx for a demo. 🙂 IMHO, animating SVGs ough to be a huge application. Maybe https://sozi.baierouge.fr and its author can give us some further inspiration on this matter. Thanks a bunch!

poggers

We do this with handlebars templates. It allows us include partials and pass a "context" to the partial to be rendered....

We wanted something similar to components on client side frameworks. It works ok, but handlebars has a lot of gotchas... The ideal solution would be a "real" component based templating language for the server.

There are really two partial-related use cases when considering htmx: 1) traditional create-a-separate-file partials, with some sort of

include

funcitonality 2) my proposed "inline partials" syntax, which allows you to define a partial bit of content directly and inline within an outer template. The first version of this feature is available in many templating systems, including rails, where I use it frequently. It is most useful when you want to reuse a partial from multiple places, but it's kind of a shame, from a locality of behavior standpoint, if you only incluce the partial in one place. In this latter case, where you are including the inline partial in once place, it would be nice to have the latter feature, allowing you to give a partial bit of a larger template a name, and then render that "inner" template directly, with the necessary symbols.

as far as I know, this latter feature is very rare in templating languages, but I hope that as htmx is used more widely, people will consider adding it to them

So something like this, where you just want to poll a bit of content, could easily be defined inline within the main template and then you can add a handler that renders just that small bit of the template:

def user_count
    return render_partial( "main_template.user_count.html", user_count:get_user_count() )
  end

Hi I have this form, that takes a github gist url as an input, and when submitted it inserts a script tag in the html, e.g.:

<form hx-post="/save_gist_url/" hx-target="this">
    <input type="url" name="gist_url" value="https://gist.github.com/ViggieSmalls/caf2e27d587cdd92d4dc2c6feeb62490.js" id="id_gist_url">
    <button>Save</button>
</form>

and the response from the server is

<script src="https://gist.github.com/ViggieSmalls/caf2e27d587cdd92d4dc2c6feeb62490.js"></script>

The script tag is placed inside the html, but the js is not executed. How can I get the gist from GitHub to be displayed on the page? 🙂

django-mako-plus seems to support use case 2. http://doconix.github.io/django-mako-plus/topics_partial_templates.html

interesting, good find!