How to add JS event code on a model/form widget

Using Django Templates & Frontend
1

This seems like such a simple thing but I must be searching with the wrong question and cannot find the answer… I have a Django form I would like to have hide a field if a checkbox is checked, so I want to add a Javascript event handler to the widget/field. On a non-model form I tried using attrs={‘onClick’: ‘myFunction();’} but that did not work and I have no clue how to do with a modelform either.

I am trying to generate something like:
<tr><td colspan="4">Is reporter:<input type="checkbox" onClick="myFunction();"></td></tr>

Currently, my form (called rprtrform) has this field:
rprtr = forms.BooleanField(required=False, initial=False )

My template has:

<tr>
                      <td colspan="4">Is reporter: {{ rprtrform.rprtr }} </td>
</tr>

Thanks in advance

2

Are you using jQuery, or are you looking for a plain JavaScript solution?

When you tried this, what did not work? Did it not render correctly in the page or did it not work when the page was loaded? What was the complete statement you tried to do this with?

3

Ken,
Hello… well, when you reply back with a leading question like that it suggests to me I was close, that it really IS that easy, but I am doing something trivially wrong… so I rewrote/tried again and it turns out I had copied something that had a back tick vs a single quote… it DOES work!! Grrr, I am embarrassed…

rprtr = forms.BooleanField(label='Is Non-Owner Reporter', required=False, initial=False, widget=forms.CheckboxInput(attrs={'onClick': 'myFunction();'}) )

Tada!..
<tr><td colspan="4">Is Reporter: <input type="checkbox" name="rprtr" onClick="myFunction();" id="id_rprtr"> </td></tr>

Thanks! I hope this helps someone else…the documentation is not clear on this, only suggestive…

4

Thank you for your post.
It helps me a lot