• Home
  • Blog
  • Documentation
  • FAQ
    • Pre-Sales Questions
  • Sign Up
  • Log Out
  • Get Easy Forms
  • Home
  • Blog
  • Documentation
  • FAQ
    • Pre-Sales Questions
  • Sign Up
  • Log Out
  • Get Easy Forms
home/Knowledge Base/How To/How to Show/Hide HTML elements with Conditional Rules
Popular Search:Getting Started

How to Show/Hide HTML elements with Conditional Rules

169 views 1 September 14, 2021 admin

Toggle between hiding and showing an element with Conditional Rules is very easy, just follow these two steps:

1. Add a selector to the HTML elements

For Headings and Paragraphs, go to the Form Builder and add a Container CSS Class, for example: toHide

For HTML Snippets, go to the Form Builder and enclose your HTML code between an element with the selector, for example:

<div class="toHide">
My custom html element
</div>

2. Show/Hide the Elements by using their CSS selectors

Finally, go to Conditional Rules and add a new rule with the following action:

Hide Element .toHide

Note: Consider that we added a dot to the CSS class to identify it as a CSS class, because it is a jQuery selector.

That’s it!

Was this helpful?

1 Yes  1 No
Related Articles
  • How to Embed the Same Form Multiple Times on the Same Page?
  • How to Submit a Form as WhatsApp Message
  • How to Create Multi-Page Forms to Increase Conversions: Survey Funnel
  • How to Review All Answers Before Submit a Form?
  • Add Easy Forms to WordPress pages and posts
  • Use a URL Query String to Specify Different Default Values for a Form
Leave A Comment Cancel reply

You must be logged in to post a comment.

How To
  • How to Show/Hide HTML elements with Conditional Rules
  • How to Embed the Same Form Multiple Times on the Same Page?
  • How to Submit a Form as WhatsApp Message
  • How to Create Multi-Page Forms to Increase Conversions: Survey Funnel
  • How to Review All Answers Before Submit a Form?
  • Add Easy Forms to WordPress pages and posts
View All 22  
Popular Articles
  • How to enable / disable DEBUG mode
  • How to update Form Stats from the command line
  • How to RTL (right-to-left) a Form?
  • How to Remove the Default Choice from a Select List Field
  • How to Insert an Image into a Notification or Confirmation Email
KB Categories
  • Add-Ons
  • Advanced Techniques
  • Common Issues & Troubleshooting
  • Developers "How To's"
  • Getting Started
  • How To
About Easy Forms

With Easy Forms you can create unlimited web forms and most importantly the complete management of them without paying monthly fees

Resources
  • Knowledge Base
  • Documentation
  • Pre-sales Questions
  • Blog
Useful Help Links
  • Get Easy Forms
  • Live Demo
  • License Terms
  • Contact Us
Frequent Visit Links
  • Pre-Sales Questions
  • System Requirements
  • Installing Easy Forms
  • Upgrading Easy Forms
  • Privacy Policy
  • © 2015 - 2021 Baluart EIRL. All Rights Reserved.

Popular Search:Getting Started