Some people use Alpine Js with htmx. You might be referring to that?

Any idea when it this update will be formally released. I'm quite new at webdev and programing in general so I'm not super confident. But on the other hand I really do want to just stick with htmx and get it to work.

Is there any htmx course with flask?

Sorry. I just threw the word around I guess. By "binding" I just meant the same placing a template expression and then having htmx render it, 😅. Basically exactly what we're supposed to be doing.

Anyway, you guys are really nice 👍 in here. You actually respond. I have been in so many online communities and boy oh boy. Thank you 🙏

<input type="text"
                hx-post="{% url 'qdbsuche' %}" 
                hx-target='#results'
                hx-trigger="keyup changed delay:500ms"
                name="search_term"
                class="form-control-sm mr-2" 
                placeholder="Suchbegriff" />

i am trying to make a db-query and it is working fine. i would really like to implement a "minimum" search value. so the trigger fires after lets say the length of the input exceeds 3 letters. Otherwise it will needlessly search the entire database for an empty string etc, which i do not want. if my understanding is correct it currently waits for a change in the input field and then fires after 500ms. that is fine. But i really need to add this extra filter

adding "minlength" doesn´t do anything. modifying the hx-trigger didn´t seem to do the trick either. i am not sure how to accomplish this.

i assume i need something like

target.length > 2

but i am not sure if that is the correct syntax. from my understanding it is coma seperated. but if i add this, it seems to ignore my code

worst thing is, when a user is deleting an input, it fires the trigger again, causing a massive search every time

do i really need to write inline JS just for this ?

it straight up ignores basic html

Try

keyup[event.target.value.length>2] changed delay:500ms

i´ll try that. thank you

still ignores it

Got it. You can add

hx

attributes to your image, to make it defer loading, cause a

GET

or

POST

, etc. As far as the

src

attribute, though, you'll likely either write the same way you write your HTML. To change its value after the HTML has been delivered to the browser, as @powerful-helmet-42757 mentioned, you can use a plain JavaScript event or a lightweight library. The "binding" story for htmx is that, for the most part, you don't need to. It's a mindset shift, especially for developers who may have learned the Angular / React / Vue styles first; if you stick with it, though, I think you'll find that it eliminates entire classes of complexity. And, as you mentioned, the community can't be beat - it's one of the best communities I've seen in my decades on the Internet. I'm about to have a question for that community myself. 🙂

If you have more elaborate syntactic needs, it's probably best to write your own javascript logic to capture that and then trigger an event. You don't want to have a super complex filter expression.

i´ll try this. Thanks for your time.

entire point of using htmx for me is the simplicity. doesn´t help if it breaks needed functionality though. If i have to end up writing inline JS again, then i might as well not use this at all to avoid security issues. just using this for the added simplicity during development. i´m still fairly new to this and not too familiar with the syntax etc. so i am very grateful for your help.

dirty fix would be to check for the length in the backend and continue if the search term length is sufficient. might end up doing just that. i really cannot afford to search 4 individual tables with a wildcard search. would end up generating several tensthousand results.

i should probably follow another tutorial or two. just require more practice.

this is still less of a hassle than using next.js or anything similar, so i really want this to work.

@mysterious-toddler-20573 if you remember my issue, what path would you recommend I follow?

try the dev version of htmx?

or try hyperscript?

or try using htmx to replace the whole table row?

or could I like use htmx to fetch it but return it to a hidden div and then use hyperscript to swap it from that hidden div to where I actually want it?

i would be REALLY careful with blindly using hidden "input". unless you are just running this offline. Just asking to be exploited

is there a discord or reddit or something for hyperscript?

Uh there's a hyperscript channel in this Discord