JSFiddle - React, Tailwind, and code Playground

by dixalex

JavaScript

function LoadPage() {
  var blue_bunny_input = $('#' + $('img').filter('[title="Blue Bunny"]').closest('label').attr('for'));
  var blue_ribbon_input = $('#' + $('img').filter('[title*="Classics"]').closest('label').attr('for'));
  blue_bunny_autofill();
  $(':checkbox').on('change', function(ncp_event) {
    blue_bunny_autofill();
  });

  function blue_bunny_autofill() {
    if (blue_bunny_input.is(':checked') && blue_ribbon_input.is(':checked')) {
      $('#Q34_2').prop('checked', true).change();
      $('#Q35_2').prop('checked', true).change();
    }
    if ((blue_bunny_input.is(':checked')) && (blue_ribbon_input.is(':checked') === false)) {
      $('#Q34_1').prop('checked', true).change();
      $('#Q35_1').prop('checked', true).change();
    }
    if ((blue_bunny_input.is(':checked') === false) && (blue_ribbon_input.is(':checked'))) {
      $('#Q34_2').prop('checked', true).change();
      $('#Q35_2').prop('checked', true).change();
    }
    if ((blue_bunny_input.is(':checked') === false) && (blue_ribbon_input.is(':checked') === false)) {
      $('#Q34_1').prop('checked', false).change();
      $('#Q35_1').prop('checked', false).change();
      $('#Q34_2').prop('checked', false).change();
      $('#Q35_2').prop('checked', false).change();
    }
  }
}