Funny, I had JUST the same issue today. I eventually figured out "remove" is used for removing DOM elements or attributes of elements (ex. value, class, id). "innerHTML" is not an attribute, but a property.

One thing that I got stuck on for 2 hours today is that I just CAN'T set anything as a global variable. I wanted to set my modal using

set $modal to mdb.Modal.getInstance(#modal)

(I use Material Design Bootstrap and it's components), but I keep getting an error

Error: variables declared at the feature level must be element scoped.

I tried both setting it: - in the element, before & after the

<script defer src="{% static 'js/_hyperscript.min.js' %}"></script>

- before - inline, inside an

_="set $modal to mdb.Modal.getInstance(me)"

attribute No matter what, I keep getting this darned error.

put that within an init block

Tried that as well

Forgot to mention

Inside the element

mmmm

But i don't think i tried that in an inline _ attr

That might be the only combination which i missed

not sure we process hyperscript in the head

lol, sorry about that

one thing I would say is: don't bang your head too much on hyperscript, just ask in the #796428329531605032 channel and use a js work around in the meantime, so you can keep moving

Good advice

unfortunately #796428329531605032 is our current autocomplete feature 😑

LOL

That was it

It was the only thing I haven't tried. I had to do

<div
  id="modal"
  class="modal fade"
  aria-hidden="true"
  aria-labelledby="modal"
  tabindex="-1"
  _="init set $modalInstance to mdb.Modal.getOrCreateInstance(me) end"
>

Thanks alot !!

Hi, how to enable a disabled form by clicking a button using htmx, is that possible or should I use JS.

You could do it in hypersctipt: "on click toggle @disabled on #some-form"

Assuming the form has an id some-form

Htmx is more suited for things than involve sending a request to the server whereas this is an exclusively frontend issue.

Check out this example https://htmx.org/examples/click-to-edit/

Hi everyone, I have a small project where i want to add htmx to enhance the forms Lets say i have the following form rendered by

django-crispy-forms

html
<form method="POST" action='/user/signup'>
  <input id='username' type='text' name='username' />
  <input id='password' type='text' name='discriminator' />
</form>

This is my python code

python
# forms.py

class UserNameWithDiscriminatorForm(forms.Form):
  username = forms.TextField()
  discriminator = forms.IntegerField()

python
# views.py

def check_if_username_with_discriminator_exists(request:HttpRequest)->HttpResponse:
  form = UserNameWithDiscriminatorForm(request.POST or None)
  if form.is_valid():
    ...
    # Checks to see if current username with discriminator is available
    if username_is_available:
      return HttpResponse(200)
    else:
      return HttpResponse(400)

Now i submit a form using

jQuery

to check if username with discriminator is available and then add a

red

class to input element. Is it possible to recreate this effect using

htmx

? ( I am comfortable with JS | Just want to know if HTMX can achieve what i am looking for ) Thanks :D

Any issue using hx-boost="true" on the body tag on a brand new django site and then overide the default hx-get on a case by case basis if needed? Seems like a no brainer to me, but probably missing something. I am aware you need to handle the CSRF token on specific actions, but what else do i need to consider?

*Hello everyone

hx-boost

will get you 80% of the way there. The rest is gonna be up to you depending on how complex you want to make your interactions

thank you!

Yep. You could do it by either still having the user submit the form, or you could do it like this example (https://htmx.org/examples/inline-validation/). I'd be tempted to move your checks if a username with discriminator is available to the form

clean

method and have it attach an error using

form.add_error()

, that way Django will automatically format the error inline and all you've got to do is get htmx to replace it.