Odoo V16 - Show/hide dynamically input on website register form

Question

After adding two fields on website register form,

​- the first is a checkbox "I am a company"

​- the second one is input char SIRET NUMBER

I am trying to (THE GOAL IS) : hide the second input "siret number" if the checkbox "I am a company" is unchecked, and show it if this field is checked.

Both fields are correctly displayed but ... "vat number" does not hide when I uncheck the checkbox ...

Thank you for your help !

<div class="mb-3 field-is_company">
                <label class="form-check-label" for="is_company">Je suis une société</label>
                <input type="checkbox" t-att-checked="True" name="is_company" id="is_company" class="form-check-input"/>                
            </div>            
            
            <div class="mb-3 field-siret" attrs="{'invisible' : [('is_company', '=', False)]}">
                <label for="siret">Votre SIRET</label>
                <input type="text" name="siret" t-att-value="siret" id="siret" class="form-control form-control-sm" required="required"/>
            </div>

Answer 1

You can use simple Html/js:

<div>
<label for="siret">Est une entreprise</label>
<input type="checkbox" name="is_company" id="is_company" checked="checked" onchange="
document.getElementById('siret_div').style.display=(this.checked)?'block':'none';" 
class="form-check-input"/>
</div>
<div id="siret_div">
<label for="siret">Votre SIRET</label>
<input type="text" name="siret" t-att-value="siret" id="siret" class="form-control form-control-sm" required="required"/>
</div>