Fork me on GitHub

toggle

An article by Gaspard Bucher

insert/remove current node from a list

insert/remove current node from a list

  • set (relation name) relation to set
  • for (RubyLess) other side of the relation
  • arity (one/many) default is ‘many’
  • js Javascript to trigger on toggle. Toggled element in var “e”.
see each

Insert or remove an object from a list. The list can be a “context” Property or a relation. Example:

<span do='toggle' set='favorite' for='visitor'/>

See toggle attributes for details.

toggle on lists

If the arity of the relation is “one”, the JS code for toggle needs to parse siblings to properly turn off the previous selection. This means that in this case the “toggle” attribute on each should be used. Example with “icon” relation:

<ul do='images in site limit 20 paginate p'>
  <li do='each' toggle='icon_for' for='start' arity='one'><r:img mode='pv'/></li>
</ul>

Use the attribute version instead of do='toggle' prevents the addition of an extra “div” inside “li” tag.

output

This is the result of a “toggle” attribute on a table row:

toggle example

Javascript trigger on toggle

<span do='toggle' set='favorite' for='visitor.node' js='Zena.reload("side_list")'/>

This would reload some “side_list” div (updating element count or cart price for example).

nested toggle

Nesting toggle elements does not work.

You should use a condition when rendering an element to only show “toggle” buttons when the whole element is not itself used to toggle a relation. This can happen if you have a “favorite” toggle on a media listed to link as “icon” for a post for example.