{ Frameless }

Conditionally show HTML with data-if

Follow

You can trigger removing and inserting parts of your HTML page using the data-if="" attribute. Use this attribute to expand and collapse things.

The data-if takes an XPath query. If that query returns false, the element will be removed.

It can be used to show an element only if a user is logged in for example.

<div data-if="$logged-in">
  <p>Hi, welcome back!</p>
</div>

<div data-if="not($logged-in)">
  <form action="login">
    ... a login form
  </form>
</div>

Running Frameless.variable("$logged-in", false) (from your developer console) would hide the element, then executing Frameless.variable("$logged-in", true) would make it re-appear.

Have more questions? Submit a request

Comments

Powered by Zendesk