I am trying to create a custom page where the user can click a button to show/hide part of a form. To be specific, the page asks the user if a displayed customer satisfaction score is correct or not, and the button would them the option to change their score by showing a dropdown list on the form with scoring options.
I was able to achieve something similar to this by using a Yes/No radio button within the same form, and then setting up a dependency for the drop down list element. This “works”, but is a bit clunky for the user and ideally is not how I want this to be set up.
I have a feeling I’ll need to add some custom javascript for this to work, but I’m not sure how exactly to do this and more specifically how to reference particular form elements (in this case, a drop down list) via javascript in hubspot. This would be something very straightforward to do in plain code, but I can’t seem to figure it out through Hubspot.
If anyone could provide any tips or insight as to how to accomplish something like this, please let me know.
@jburns428 You could use JQuery to select the fields and update the css on them to hide them. If you went into the design manager you can write the code there for the page.
Are you referring to the “Edit Head” option in the design manager? I see that, but I’m still unclear on how I would select elements on the page since I can’t see any of the elements in actual HTML. Is there some other place I should be looking to see the raw code for the entire page? Should I just view the source for the page in my browser to get relevant class names / ids?
@jburns428 I’m glad you have it figured out. I would have suggested writing the JQuery in the JS console on your browser to test it out before you saved it in design manager.
.png "HubSpot Employee"){kind=icon}
