Hide a Submit Button till something is selected on a Form

Highlighted
Anonymous
Not applicable

Hide a Submit Button till something is selected on a Form

Hello

I have built this form for our website (non-marketo LP).

http://www.bkd.com/video-test.htm

I have tried several different things including using Sandford's wonderful Codepen and trying different things but I can't seem to figure it out because I am not trying to use rich text. I think that is the main issue I am having.

Basically what I need to happen is when someone picks an option under, "Why are you contacting us?" The submit button shows with each of those options. Currently it shows up no matter what. Can I accomplish this?

Thank you in advance

3 REPLIES 3
Highlighted
Level 10 - Community Moderator

Re: Hide a Submit Button till something is selected on a Form

As I explained on the other thread just now:

The way this logic is set up is you create Visibility Rules (in Form Editor) that show/hide a Rich Text area based on a Select field.

Then the Submit button's visibility is directly tied to the RT area's visibility.

This allows the JavaScript side to be entirely generic. It doesn't need to know about your Select options at all, not even the name of the Select field.

While the same outcome could be done entirely in JavaScript (and I probably would do it this way in my own work) I was trying to avoid a JS customization task for non-developers.

Highlighted
Anonymous
Not applicable

Re: Hide a Submit Button till something is selected on a Form

Thank you for responding. I was really hoping I could do this through CSS as well. I am not great at JavaScript. I wonder if I could come up with a cheat to make it work. If not, the button will just stay.

Thank you again, Sanford. Have a good day

Highlighted
Level 10 - Community Moderator

Re: Hide a Submit Button till something is selected on a Form

But you don't need to write any JS. That's the point of the recipe, the JS is always the same.

This can't be accomplished only with CSS. There's no CSS selector that will act on the vanilla form DOM properly.