KSS Opener: Events
When Developers start using product as a tool different hooks and freedom points become handy. In this post basic open/close events are described. Ability to add own reaction and/or prevent default reaction.
Ability to add own reaction and/or prevent default reaction is described in KSS Opener events post:
Besides defining ":opener-init" even that initializes opener, developer has ability to extend/override open/close events:
.term:opener-init{
evt-init-elementSelector: '.details';
}
.term:opener-open{
action-client: executeCommand;
executeCommand-commandName: replaceInnerHTML;
executeCommand-commandSelector: '#status';
executeCommand-html: 'expanded';
}
.term:opener-close{
action-client: executeCommand;
executeCommand-commandName: replaceInnerHTML;
executeCommand-commandSelector: '#status';
executeCommand-html: 'collapsed';
}and HTML for the samle is:
<hr />
<div id="status">Current status</div>
<hr />
<div class="term">
History
<div class="details">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum
iaculis eros eu purus. Integer accumsan leo id lorem viverra vulputate.
Donec feugiat nunc molestie massa nonummy pulvinar. Proin porta pede
sit amet lectus. Duis leo urna, tempor non, condimentum condimentum,
commodo non, libero. Integer feugiat, pede at.
</div>
</div>The resulting behaviour on page is:
If you do not see a flash movie above, see original post.
The important thing is that on open and close you can have client-side or server-side actions. You can disable default expand/collapse behaviour, with preventDefault parameter:
.term:opener-open{
preventDefault: true;
}
tags: KSS | KSS Opener | Plone