Hey guys. I need to allow users to check a checkbox after they click on another element (the "parent" checkbox). I tried to use onclick="return true" but it does not work. Can you help me please? Thanks! Screenshots: The parent checkbox is not checked, the child checkbox is readonly. The parent checkbox is checked, the child checkbox is not readonly but it cannot be checked. Code: <script type="text/javascript"> function ss_verification_checkbox(checkbox, object){ if(checkbox.checked){ object.readOnly = false; object.style.background='#ffffff'; object.style.color='#333333'; object.className=''; object.onClick='return true'; } else{ object.readOnly = true; object.style.background='#f0edea'; object.style.color='gray'; object.onClick='return false'; } } </script> <p><label><input type="checkbox" name="ss_human_verification_cqa_checkbox" <?php if(get_option('ss_human_verification_cqa') == 1) echo 'checked="checked"'; ?> onClick="ss_verification_checkbox(this, this.form.ss_human_verification_cqa_answer_case_sensitivity_checkbox);ss_verification_checkbox(this, this.form.ss_human_verification_cqa_question_input);ss_verification_checkbox(this, this.form.ss_human_verification_cqa_answer_input)"> <strong>Custom question & answer</strong> - users have to fill an answer to a question</label> <br><label class="ss_sub_option"><input type="checkbox" name="ss_human_verification_cqa_answer_case_sensitivity_checkbox" id="ss_human_verification_cqa_answer_case_sensitivity_checkbox" <?php if(get_option('ss_human_verification_cqa_answer_case_sensitivity') == 1) echo 'checked="checked"'; if(get_option('ss_human_verification_cqa') == 0) echo ' readonly="readonly" onClick="return false"'; ?>> Force answer check to be case sensitive</label></p> HTML:
Did you check error console? I got errors ... this.form is null - you have no forms as I see your code. Regards
Well, I did not include here the full code, it would be really long. My JS console does not return any errors.
My guess would be that, the method is being called twice (event bubbling). Can you try object.stopPropagation ( );
I added it here: <script type="text/javascript"> function ss_verification_checkbox(checkbox, object){ if(checkbox.checked){ object.readOnly = false; object.style.background='#ffffff'; object.style.color='#333333'; object.className=''; object.onClick='return true'; [B] object.stopPropagation();[/B] } else{ object.readOnly = true; object.style.background='#f0edea'; object.style.color='gray'; object.onClick='return false'; } } </script> Code (markup): Is it the right place?