domapi.Dropdown
See also: ElmSee also: Component
This component forms the basis for all the dropdown-like components, like Datepicker , Colorpicker and Combobox . If you create your own dropdown components, this is a good ancestor class to use.
The dropdown component is intended for use as an ancestor class for other controls. On it's own its a pretty useless component.
Some general notes about implementing:
Descendant components should implement a function named draw() to draw the dropdown panel's content.
Descendant components should read the value of the autoClose property and respond accordingly.
Dropdown Example: system, aqua
Dropdown Constructor
var dropdown1 = domapi.Dropdown({
});
Events unique to domapi.Dropdown
Methods unique to domapi.Dropdown
Properties unique to domapi.Dropdown
| onbeforechange ( value ) |
|---|
Fires just before the component's value changes. This gives you an opportunity to respond to the change.
You must return true to allow the change to occur. Returning false disallows the change.
The single parameter passed into the function is the new value.
Example:
// disallow value == 5
elm1.onchange=function(value){
if(value==5)return false;
else return true;
};
Parameters:
| Parameter | Type | Required | Default | Description |
|---|---|---|---|---|
| value | variant | Y | The new value |
| onchange ( value ) |
|---|
Fires just after the value changes (and after the onbeforechange event allowed it.)
The single parameter passed to the event is the new value. Decendant components may overwrite this functionallity.
Example:
elm1.onchange=function(value){alert(value)};
-or-
elm1.onchange=changed; // where changed is a function
Parameters:
| Parameter | Type | Required | Default | Description |
|---|---|---|---|---|
| value | variant | Y | The new value |
| onclose () |
|---|
Fires when the dropdown is closed.
| onopen () |
|---|
Fires when the dropdown is opened and displayed.
| setDoRollover ( rollover ) |
|---|
Parameters:
| Parameter | Type | Required | Default | Description |
|---|---|---|---|---|
| rollover | boolean | Y | Used to set the Dropdown.doRollover property. |
| autoClose | type : boolean | default value : true |
|---|
Whether or not control closes upon value selection. Must be implemented by descendant class.
Example:
elm1.autoClose = false;
| direction | type : String |
|---|
Which way the dropdown opens (up, down, left, right)
Example:
elm1.direction = "right";
| doRollover | type : boolean | default value : true |
|---|
Read-only. Whether or not the control uses rollover animation.
Use setDoRollover() to modify.
| dropBtn | type : Rollover |
|---|
Pointer to the button used to open and close the dropdown.
You can toggle the dropdowns state by calling dropBtn.onclick(), which simulates a mouse click.
| dropDown | type : variant |
|---|
A reference to the element displayed when the dropdown is opened. Varies widely depending on the component. For instance, the dropDown of a Datepicker component is a Calendar .
| edit | type : HTMLElement |
|---|
Pointer to the edit control, which is a standard <input> control. Use edit.value to retrieve value.
Example:
alert(elm1.edit.value);
| opened | type : boolean | default value : false |
|---|
Read-only. Whether or not the dropdown is opened.
