...
- CustomView.$frevvoControl(el) returns the HTML element corresponding to the frevvo control that triggered the handler. This is typically a DIV HTML element and typically has CSS class 'f-control'
- CustomView.getState (el) returns the state of the control as a JavaScript object. The state contains things like the label, value, hint, help etc. Use a tool such as Firebug or a different JavaScript debugger to view it in detail.
- CustomView.getExtId (el) returns [[V4_Designing_Forms#Name | the name of the control]] as set in the Form Designer.
- CustomView.getIndex (el) returns the index of the control in its enclosing repeat control if the control is repeating. If the control is not repeating, it returns -1.
- CustomView.hasClass (el, className) returns true if the control has the indicated CSS class, false otherwise.
...
More Examples
...
You can add different event handling to your JavaScript code. This example handles click, mouseover and mouseout events to the Submit button:<pre>
| Code Block |
|---|
/* |
...
* Custom Javascript here. |
...
*/ |
...
var CustomEventHandlers = { setup: function (el) |
...
{ if (CustomView.hasClass(el, 's-submit')) |
...
{ alert('setting up s-submit events'); |
...
FEvent.observe(el, 'click', this.submitClicked.bindAsObserver(this,el)); |
...
FEvent.observe(el, 'mouseover', this.submitMouseOver.bindAsObserver(this,el)); |
...
FEvent.observe(el, 'mouseout', this.submitMouseOut.bindAsObserver(this,el)); |
...
}
}, submitClicked: function (evt, el) { alert ('Submit button was clicked'); }, submitMouseOver: function (event, element) { alert ('Submit mouse over'); }, submitMouseOut: function (event, element) { alert ('Submit mouse out'); } } |
==== Extensions for flows ==== In addition to the above, flows also support a few other methods. <pre> var CustomFlowEventHandlers = { onNextClicked: function (name, id) { alert ("Next button clicked for activity: " + name); }, onNavClicked: function (name, id) { alert ("Nav button clicked for activity: " + name); }, onSaveSuccess: function (submissionId) { alert ("Save complete. New submission id is: " + submissionId); }, onSaveFailure: function () { alert ("Save failed"); } } </pre> As the method names indicate # onNextClicked() is called when the Continue button is clicked: this button might be labeled Continue or Finish or might have a custom label assigned by you. The parameters are the name and id of the current activity (step) in the flow. # onNavClicked() is called when the user clicks on a link in the Navigation toolbar if it is displayed. The parameters are the name and id of the activity (step) in the flow that is clicked. # Finally, onSaveSuccess() and onSaveFailure() for flows must be defined in the CustomFlowEventHandlers class.
...