Jump to content

How do I separate code for more than one conditional logic question?

Recommended Posts

Site URL: https://evolutionboulders.com/careers

Hi everyone,

I have an application form I'm trying to streamline, as a few questions work best as conditional ones. I was able to get it working for one question, but I can't figure out how to create separate conditional questions (I'm flying by the seat of my pants and any online tutorials I can find, I am 100% not a web developer). I was able to get as far as hiding all the responses I wanted, but answering any trigger question just triggered ALL the conditional questions to activate. How do I separate the code to make sure each conditional question only triggers a unique set?  I know there are lots of sites that build a form for you, but we're trying to keep costs down as much as possible and don't want to take on extra monthly fees if we can help it.

Here's the code I have for hiding the "Additional Employment" questions unless you click "yes" to the conditional question. 

 

Thanks in advance you smart cookies!

 

Quote

<style>

  #text-b8354b66-fc7a-45a2-bf38-113427922284,

  #address-ff7ea4e9-a7ec-46e3-8508-c2eef31c5288,

  #textarea-e5bd6ba6-2619-4581-b16c-303f01c73ba9,

  #textarea-56bc3a7b-8525-4c3d-86ec-b22f2c27d6c4,

  #date-8d625645-5b78-469c-bb2c-0c4668e5a0d9,

  #date-a3739475-f31c-4075-9f5c-0ca1c7c089f7,

  #name-602c7be8-7429-4c01-b291-30bb40de546b,

  #text-f6370dfa-c787-41f4-b3ae-a040ffd9f5a9,

  #phone-129f7e66-42d4-403b-be07-4f1ee2851176,

  #text-69591154-4d02-4110-82c3-bfa95445d10b,

  #radio-791b4b8f-3081-4fe0-b619-158196df3d51

 {

    display: none;

}

</style>

<script

src="https://code.jquery.com/jquery-3.6.0.min.js"

  integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="

  crossorigin="anonymous"></script>

 

<script>

 $('#radio-18e4296e-e13a-457b-8932-228a675d468b input').click(function(){

    selection = $(this).val();

  

   if (selection == 'Yes') {

     $('.form-item').show()

   }

  });

</script>

 

Link to comment
  • 2 weeks later...
  • Replies 1
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Hello! It looks like this line "  $('.form-item').show()" is actually showing all form items, when what you want to do is only show a select few (the ones that are hidden with CSS initially). You should modify this line to show those items only, and you should also add an else statement for if the no option is selected where you will hide those same items. Does that make sense?

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.