Overview
Most widgets require an element ID name. This ID links to an element, such as a <div>, in the HTML report page. Widgets can take one or more element IDs, and there are four ways to define them: by name, custom function, threshold, or calendar.
By Name
The simplest and most common way. Reference the HTML element ID directly:
ele: ['graph']Custom Function
A JavaScript function can be used as long as it returns a valid element ID. Metrics can be passed as parameters:
ele: ['getElement(||voip.jitter||,55)']The getElement function receives the VoIP Jitter result and the number 55, then returns a valid element ID:
function getElement(jitter, number) {
if (jitter < 100 && number > 0) return 'graph';
return 'badgraph';
}Threshold
Choose an element based on whether a metric passes a threshold check. An API function is provided:
ele: ['ppf_eleThresh("!voip.jitter|bad", "threshtrue", "threshfalse")']| Parameter | Description |
|---|---|
| 1st | Threshold definition. In the example, !voip.jitter|bad tests if VoIP Jitter is NOT bad. Use ! for negation. |
| 2nd | Element ID when the check is TRUE (e.g., "threshtrue"). |
| 3rd | Element ID when the check is FALSE (e.g., "threshfalse"). |
The first parameter can also be an array of thresholds — all must be true to pass:
ele: ['ppf_eleThresh(["!voip.jitter|bad","!voip.loss|bad","!voip.mos|bad"], "threshtrue", "threshfalse")']Calendar
Choose an element based on a calendar condition. An API function is provided:
ele: ['ppf_eleCal("todayvalid","caltrue","calfalse")']| Parameter | Description |
|---|---|
| 1st | Calendar condition name. Use ! prefix for negation. |
| 2nd | Element ID when the condition is TRUE (e.g., "caltrue"). |
| 3rd | Element ID when the condition is FALSE (e.g., "calfalse"). |
Multiple Elements
To place an identical widget in multiple locations, extend the array. This is useful for items like copyright statements that appear on every page:
ele: ['ele1', 'ele2', 'ele3']You can mix and match names, functions, thresholds, and calendar conditions within the same array.