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

Question

Question

Hide Next/Previous Button Based on Radio Button Value

asked on April 23, 2018

I have been looking at this answer https://answers.laserfiche.com/questions/116675/Hide-Next-Button-in-Pagination-Until-Required-Fields-are-Completed#141034 to hide the next button until required fields are filled in.

Can anyone point me in the right direction as to how to alter the code to only show the Next button if certain values are selected on a radio button?

 

I have a radio button with 4 options.  The last 2 options simply tell the user that based on their selection, they do no not need to start the form.  So I want to hide the next button.

 

Currently using 10.2 but will be moving to 10.3 in the next few months.

 

Thanks.

0 0

Replies

replied on April 23, 2018 Show version history

Hi Jennifer,

The following snippet should do the trick. Caveat: this actually en/disables the "Next" button, which IMO is a bit less jarring; replace '.removeAttr(...)' with '.show()' and '.attr(...)' with '.hide()' if you want exactly that functionality.

(function() {  
  $(document).ready(function() {
    $('.radio input').change(function(){
      var choice = $(this).val();
            
      switch(choice) {
        case 'Enabled':
        case 'Enabled 2':
          $('input.cf-next-btn').removeAttr('disabled');
          break;
        case 'Disabled':
        case 'Disabled 2':
          $('input.cf-next-btn').attr('disabled', 'disabled');
          break;
        default:
          break;
      }
    });
  });
})();

Here's a screenshot of the test form it works with:

~Rob

1 0
replied on April 23, 2018

Thanks.  I must not be switching something right.  I replaced all the case lines to read the actual values on my radio buttons but it is not disabling the Next button for any of the choices.

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

Sign in to reply to this post.