I am working on a dynamic table where I need to show or hide certain parts based on the state of corresponding checkboxes. When a checkbox is unchecked, I want to hide the specific section of the table with the class "newtable" for that row only. Each row in the table should operate independently in terms of visibility. If a checkbox is checked, additional information appears and must be filled out, while if it is not checked, no further action is required. I know how to use JavaScript to hide all instances of "newtable", but my challenge lies in hiding only those that are related to checked checkboxes. Any guidance on this matter would be highly appreciated.
Due to having variables from different models, I had to create this form manually since using Django's form functionalities was not feasible for achieving this setup. Your help is much appreciated!
<table>
<tr>
{% for x,y,z in stuff%}
<td>{{ x.foo }}</td>
<td>{% for item in y %}
<input type="checkbox" name="stuff.{{ item.id }}" class="item" value="True" checked/> {{ item }}<br />
{% endfor %}
</td>
</tr>
<tr><td align=center colspan="5">
<table class="newtable" border=1>
<tr><td>
<input type="radio" name="pref_id{{ z.id }}" value="1" checked> blah<br>
{% endfor %}
</td>
</tr>
</table>
</tr>
{% endfor %}
</table>