Check the checkbox if a specific option in Dropdown is selected in a Search form

[Watusi]

I would like to ask for help in my JS code. I'm trying to change the value of a checkbox in a search form when a specific option in a dropdown is selected.
I want the checkbox to be set to true if "Math" is selected in the dropdown.

Below is my code that's not currently working:

<script>
function checkdropdown(){
  var drpselected = document.getElementsByName("Value1_1").value;

  if (drpselected == "Math") {
    document.getElementsByName("Value2_1").checked = true;
  } 
  else {
    document.getElementsByName("Value2_1").checked = false;
  }
}

document.getElementsByName("Value1_1").onchange = function() {checkdropdown()};
</script>

 

Also, here is a screenshot in the "Configure Search Fields" step of the DataPage:

 

I'm hoping someone can help me with this. Thank you.

[AtayBalunbalunan]

Hi Watusi, can you try this instead:

<script type="text/javascript">

var dropdown = "Value1_1";
var checkbox = document.getElementsByName("Value2_1")[0]; 
var drp = document.getElementsByName(dropdown); 

function checkdropdown()
  {
    var drpselected = drp[0].options[drp[0].selectedIndex].text;
  
    if (drpselected == "Math")
      checkbox.checked = true;
    else
      checkbox.checked = false;
  }

  drp[0].onchange=checkdropdown;

</script>

 

Let me know if this works.

[Watusi]

Thank you, AtayBalunbalunan. This works!

22 minutes ago, AtayBalunbalunan said:

Hi Watusi, can you try this instead:

<script type="text/javascript">

var dropdown = "Value1_1";
var checkbox = document.getElementsByName("Value2_1")[0]; 
var drp = document.getElementsByName(dropdown); 

function checkdropdown()
  {
    var drpselected = drp[0].options[drp[0].selectedIndex].text;
  
    if (drpselected == "Math")
      checkbox.checked = true;
    else
      checkbox.checked = false;
  }

  drp[0].onchange=checkdropdown;

</script>

 

Let me know if this works.

 

[jasonkaeb]

I have a similar use case where I am trying to basically do the same thing. In my case, the drop down selection is element "Value9_1" and the checkbox that I want to set to true, if Value9_1 = "Yes" is "Value_10_1". I have tried the following code but am not getting this to work. Can you see what I am missing? 

<script type="text/javascript">

var dropdown = "Value9_1";
var checkbox = document.getElementsByName("Value10_1")[0]; 
var drp = document.getElementsByName(dropdown); 

function checkdropdown()
  {
    var drpselected = drp[0].options[drp[0].selectedIndex].text;
  
    if (drpselected == "Yes")
      checkbox.checked = true;
    else
      checkbox.checked = false;
  }

  drp[0].onchange=checkdropdown;

</script>

[Kurumi]

Hi @jasonkaeb - you may try this code:
 

<script type="text/javascript">

document.addEventListener('DataPageReady', function (event) {
    document.querySelector("[id*='Value9_1']").addEventListener('change', function() {
        if (document.querySelector("[id*='Value9_1']").value == 'Yes') {
         document.querySelector("[name*='Value10_1']").checked = true;
      } else {
         document.querySelector("[name*='Value10_1']").checked = false;
      }
    });
});
</script>

I hope this helps!