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

Question

Question

javascript hide section based on two things

asked on October 19, 2017

Our process has two forms - the initial submission form and then the approver review form. The approver review form has four possible approver sections. Certain sections need to be hidden at certain steps in the process. The two criteria are that a radio field be marked "Yes" and that the process stepID = 36.

If all I do is the hide for the stepID it works. As soon as I add in the check for the radio selection it stops working.  This is the javascript I have.

 

$(document).ready(function() {
  if ($('input[name="stepid"]').val() == "36") && ($('anotherFacilityVol input[value="Yes"]').is('checked'))) {
    $('.section1').hide();
    $('.section2').hide();
    $('.section3').hide();    
} else {
    $('.section2').show();
}});

0 0

Answer

SELECTED ANSWER
replied on October 23, 2017 Show version history

Instead of using .is('checked') try .checked

 

As for the Field Rules, it should work as long as there is only one StepID value you need to respond to, but the logic might be a bit tricky and you would need a "When ALL" condition instead of "When ANY"

0 0

Replies

replied on October 19, 2017

Did you copy that code exactly from the form? If so, the class name for the checkbox is missing a "."

 if ($('input[name="stepid"]').val() == "36") && ($('.anotherFacilityVol input[value="Yes"]').is('checked'))) 

 

On a side note, have you tried this with Field Rules?

0 0
replied on October 23, 2017

Hi Jason,

Yes, that's copied directly from the form. I added the missing "." but it's still not working. However, you mentioned the field is a checkbox. Maybe that's the problem I'm having? The field is actually a radio button field - should the script be different for that?

 

I did try the Field Rules and it works great for only one of the requirements (when the field is checked "yes") but not for hiding based on stepID. There are 4 approval/review steps in this process (sections on the form):

 

No is selected:

Step 1: hide section 2, 3, 4.

Step 2: hide section 3, 4.

Step 3: hide section 4.

Step 4: show all sections

 

Yes is selected.

Step 1: skip

Step 2: skip

Step 3: hide section 1, 2, 4.

Step 4: hide section 1, 2.

 

0 0
SELECTED ANSWER
replied on October 23, 2017 Show version history

Instead of using .is('checked') try .checked

 

As for the Field Rules, it should work as long as there is only one StepID value you need to respond to, but the logic might be a bit tricky and you would need a "When ALL" condition instead of "When ANY"

0 0
replied on October 24, 2017

I couldn't get that to work either. If I remove the section that checks to see if the radio button "Yes" is marked then it works perfectly. It's only when I add in the && check of the radio button that doesn't work.

0 0
replied on October 24, 2017

I would check the console in the browser for JavaScript errors, and set up a separate alert to see how exactly what is coming back from the condition.

Did you set values for the radio button options (the column next to the option list) or leave it with the default?

0 0
replied on November 7, 2017

I was able to get it so that I used the Field Rules to hide half of the sections when the variable was checked "yes" and javascript to hide the remaining section on the required StepID. Thanks for your suggestion!

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

Sign in to reply to this post.