SOLVED

Hiding the Submit Button based on the Drop Down Selection

Go to solution
freeza
Level 3

Hiding the Submit Button based on the Drop Down Selection

Hello there,

 

I am looking to hide my submit button from my Form if specific selections are made within the drop down of the form. How can I make this work? Please direct me to the correct path as this is my first time trying to execute such a thing. 

Screen Shot 2022-09-19 at 3.56.13 PM.png

In this form, if a person selects Agency/Consultants, Apply to be a contributor or Support for current contributors the form Submit button should disappear while a message pops up. I was able to hide the rest of the fields and get the message appear using the visibility rules. But I am not sure how to make the Submit button disappear once either of those selections are made. 

Thank You!

Tags (1)
1 ACCEPTED SOLUTION

Accepted Solutions
SanfordWhiteman
Level 10 - Community Moderator

Re: Hiding the Submit Button based on the Drop Down Selection

I created an updated JS snippet with fewer dependencies:

MktoForms2 :: Conditionally Show Submit v2.0.0

 

Usage should be self-explanatory: just populate submitButtonVRs with your rules. I also put up a blog post about it:

Conditionally show/disable/hide the Submit button on Marketo forms

View solution in original post

15 REPLIES 15
SanfordWhiteman
Level 10 - Community Moderator

Re: Hiding the Submit Button based on the Drop Down Selection

Have you searched old posts? I'm certain I answered this at least once once in the past. If you can't find it I can link to the code again.
freeza
Level 3

Re: Hiding the Submit Button based on the Drop Down Selection

I have looked at old posts. But I am not sure exactly where in Marketo form I am supposed to add the JS code into. I know the CSS code goes inside the Marketo Form Setting. But I don’t know where exactly the other codes location should be. When I tried putting the CSS code from your solution to my Form it started repeating the form so many times.

SanfordWhiteman
Level 10 - Community Moderator

Re: Hiding the Submit Button based on the Drop Down Selection

Can you link to the post you're referring to please?
freeza
Level 3

Re: Hiding the Submit Button based on the Drop Down Selection

freeza
Level 3

Re: Hiding the Submit Button based on the Drop Down Selection

Can Someone please help me with this?

 

I want the Submit button disappeared when someone choose Agency/Consultants in this website.

 

https://info.usertesting.com/WEB-Contact-Us-Form_Testing-Form-Submit-Button.html

SanfordWhiteman
Level 10 - Community Moderator

Re: Hiding the Submit Button based on the Drop Down Selection

I created an updated JS snippet with fewer dependencies:

MktoForms2 :: Conditionally Show Submit v2.0.0

 

Usage should be self-explanatory: just populate submitButtonVRs with your rules. I also put up a blog post about it:

Conditionally show/disable/hide the Submit button on Marketo forms

incitedigital
Level 1

Re: Hiding the Submit Button based on the Drop Down Selection

Hi, thanks for the great tutorial.  My first post here, so apologies in advance if I am replying incorrectly.    I have a quick question regarding this code.   The example here shows how to disable the submit button using the value in a Select menu.   Is the process the same with the values in a checkbox?    For our project we have two sets of checkboxes, let's call the first set of checkboxes Group A and the other set Group B.   We want to keep the button disabled until the user selects at least one option from Group A and one option from Group B.     Thanks in advance for any guidance you can provide. 

SanfordWhiteman
Level 10 - Community Moderator

Re: Hiding the Submit Button based on the Drop Down Selection

The code is agnostic about the type of form input. It doesn’t care how the value was set (select, input[type=text], input[type=checkbox], etc.).

 

You probably want to use hideButtonIf and enter empty values for each field. That means “Hide if either of these fields has the empty value.”

incitedigital
Level 1

Re: Hiding the Submit Button based on the Drop Down Selection

Thanks for the prompt response.   I have another follow up question if you don't mind.  Can you please share how I would target all checkboxes in Group A as one or do I need to list each field individually?  In regular HTML, I would add a class to all Checkbox A items and then check to see if one of the checkboxes has been checked using javascript.  In Marketo it looks like each checkbox has it's own ID and there is no way to add the same class to a set of checkboxes.   I'm trying to figure out how to set it so that I have at least one checkbox selected from Group A AND at least one from checkbox from Group B before the submit button is active.  Thanks in advance for your help.