Show or hide part of a form if certain options are selected or boxes are checked.
Example
The triggering input gets an up-switch attribute with a selector for the elements to show or hide:
<select name="advancedness" up-switch=".target">
<option value="basic">Basic parts</option>
<option value="advanced">Advanced parts</option>
<option value="very-advanced">Very advanced parts</option>
</select>
The target elements get a space-separated list of select values for which they are shown or hidden:
<div class="target" up-show-for="basic">
only shown for advancedness = basic
</div>
<div class="target" up-hide-for="basic">
hidden for advancedness = basic
</div>
<div class="target" up-show-for="advanced very-advanced">
shown for advancedness = advanced or very-advanced
</div>
For checkboxes you can also use the pseudo-values :checked or :unchecked like so:
<input type="checkbox" name="flag" up-switch=".target">
<div class="target" up-show-for=":checked">
only shown when checkbox is checked
</div>
You can also use the pseudo-values :blank to match an empty input value,
or :present to match a non-empty input value:
<input type="text" name="email" up-switch=".target">
<div class="target" up-show-for=":blank">
please enter an email address
</div>
