Javascript in WordPress Contact Form 7 plugin – Show A Field Only When Specific Checkboxes Are Selected

  checkbox, contact-form-7, javascript

Hello… I’m new one this forum… Please, I need a help…

I have this code for contact form 7 , and works perfect but with radio button (i need to be a checkbox):

<label>Select A Size:</label> [radio select-a-size id:SelectASizeRadio default:1 "S" "M" "XL" "Other"]
 
<label id="EnterYourSize"> Please Specify Your Size
[text size] </label>
 
[submit "Send"]
 
<script language="javascript" type="text/javascript">
// Hide the Text field by default
document.getElementById('EnterYourSize').style.display = 'none';
document.getElementById('SelectASizeRadio').addEventListener('click', displayTextField);
function displayTextField() {
  // Get the value of the currently selected radio button. 'select-a-size' is the name of the radio buttons you specify in the form builder
  var radioText = document.querySelector('input[name="select-a-size"]:checked').value;
  if (radioText == 'Other') {
    document.getElementById('EnterYourSize').style.display = 'block';
  } else {
    document.getElementById('EnterYourSize').style.display = 'none';
  }
}
</script>

How I can change this from radio to checkbox with same function,
when user check “Other” to get a text input field?

Source: Ask Javascript Questions

LEAVE A COMMENT