Element controls (element_controls.js)
Requirements: event_delegation.js
Somewhat abstract, yet convenient module for making elements act as controls
for other elements. To create a control, just give an element the class
name “control” then give it an id that will describe its action.
For example:
Show the menu
- Option 1
- Option 2
- Option 3
- Cancel
In the above example, the “show_menu” link, when clicked, will show the ul
with the id of “menu”. Clicking the “hide_menu” link will hide it again.
To create an element that controls itself, use the special word “self” instead
of a target element’s id attribute. When clicked, the following element will be
highlighted, assuming the script.aculo.us effects.js library has been included:
Highlight Me
This script has one more trick. You can create controls that perform multiple
actions by splitting the commands with “and”. Longer ids tend to get ugly with
this syntax, but it works well if your ids are short and sweet.
Example:
- Option 1
- Option 2
- Option 3
- Cancel
Note: Unfortunately, this syntax means you’ll run into trouble if you have any elements
that have ids that include the substring _and_. To get around this problem, you can
disable support for multiple actions by setting the Element.Controls.disableMultiple
option to true.
Not the way I see it. Sometimes, elements exist for no other reason than to control
other elements. And rather than hardcode specific behaviors, it’s much nicer to have
them generated on the fly like this.