You are viewing limited content. For full access, please sign in.

Question

Question

Set Required Fields Based on Radio Button Chosen

asked on May 17, 2017 Show version history

With some help, I was able to set up this code where it sets QAE to required if Specification = Yes OR, if I toggle the field, it will turn Required on and off for QAE.

$(document).ready(function(){
//set QAE to required if specification = yes
  $('.specification input').change(function () {
    if ($(this).val() == "Yes")
      {
        $('.qae label').append('<span class="cf-required">*</span>');
        $('.qae input').attr('required', 'True');
      }
    else
      {
        $('.qae .cf-label span.cf-required').remove();
        $('.qae input').removeClass('required').removeAttr('required');
      }
  });
  $(".specification input:checked").each(function(){  
    $(this).trigger('change');
  });
});  //close document.ready

It works great except for one issue. If I set Specification = No, it removes the * but I still see "Please fill out this field." It's no longer required and should not be showing this way. Please assist.

0 0

Replies

replied on May 17, 2017

Hi Gloria,

You can add $('.qae input').trigger('change'); to force field change so the validation would be updated. The script looks like this:

$(document).ready(function(){
//set QAE to required if specification = yes
  $('.specification input').change(function () {
    if ($(this).val() == "Yes")
      {
        $('.qae label').append('<span class="cf-required">*</span>');
        $('.qae input').attr('required', 'True');
      }
    else
      {
        $('.qae .cf-label span.cf-required').remove();
        $('.qae input').removeClass('required').removeAttr('required');
        $('.qae input').trigger('change');
      }
  });
  $(".specification input:checked").each(function(){  
    $(this).trigger('change');
  });
});  //close document.ready

Note, the $('.qae input').trigger('change'); only works for Forms 10.1 and below; for Forms 10.2 and above, use $('.qae input').parsley().validate(); instead.

1 0
replied on May 17, 2017

Instead of using the code could you just create two QAE fields?  One required and one not (different variable names of course)?  Then just show/hide one or the other based on the choices through the standard show/hide rules?

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.