Dropdown

Dropdown

Provides a dropdown list of items when clicked. One of those items can then be selected and be shown in the main component.

Constructor

Constructor
Parameters:
Name Type Description
parent HTMLElement The element to add this dropdown to.
x number The x position of the dropdown. Default 0.
y number The y position of the dropdown. Default 0.
items array An array of strings to populate the dropdown list with. Default empty array.
index number The initial selected index of the dropdown. default -1.
defaultHandler function A function that will handle the "change" event.
Source:
Example 
const panel = new Panel(document.body, 20, 20, 200, 200);
const items = ["Item 1", "Item 2", "Item 3"];
new Dropdown(panel, 20, 20, items, 0, event => console.log(event.target.text));

Extends

Classes

Dropdown

Members

# (static) dropdownPosition

Default dropdownPosition of all Dropdowns.
Source:

# (static) height

Default height of all Dropdowns.
Source:

# (static) width

Default width of all Dropdowns.
Source:
Gets and sets the position of the dropdown list. Valid values are "bottom" (default) and "top".
Source:

# enabled

Sets and gets whether or not this component is enabled. Non-enabled components will be faded out and not respond to events.
Overrides:
Source:

# height

Sets and gets the height of this component.
Overrides:
Source:

# index

Reading this property tells you the index of the currently selected item. Setting it caused the new index to be selected and the dropdown to display that item.
Source:

# text

Get the text of the currently selected item in the dropdown (read only).
Source:

# width

Sets and gets the width of this component.
Overrides:
Source:

# x

Sets and gets the x position of this component.
Overrides:
Source:

# y

Sets and gets the y position of this component.
Overrides:
Source:

Methods

# addHandler(handler)

Adds a handler function for the "change" event on this dropdown.
Parameters:
Name Type Description
handler function A function that will handle the "change" event.
Source:
Returns:
This instance, suitable for chaining.

# bind(target, prop)

Automatically changes the value of a property on a target object with the main value of this component changes.
Parameters:
Name Type Description
target object The target object to change.
prop string The string name of a property on the target object.
Source:
Returns:
This instance, suitable for chaining.

# close()

Programatically closes the dropdown if it is open.
Source:
Returns:
This instance, suitable for chaining.

# getDropDownPosition()

Source:
Returns:
the position of the dropdown.

# getEnabled()

Gets whether the component is enabled.
Overrides:
Source:
Returns:
Whether or not the component is enabled.

# getHeight()

Gets the height of the component.
Overrides:
Source:
Returns:
The height of the component.

# getIndex()

Source:
Returns:
the currently selected index.

# getText()

Source:
Returns:
the text of the currently selected item in the dropdown (read only).

# getWidth()

Gets the width of the component.
Overrides:
Source:
Returns:
The width of the component.

# getX()

Gets the x position of the component.
Overrides:
Source:
Returns:
The x position of the component.

# getY()

Gets the y position of the component.
Overrides:
Source:
Returns:
The y position of the component.

# move(x, y)

Moves the component to a specified position.
Parameters:
Name Type Description
x number The new x position of the component.
y number The new y position of the component.
Overrides:
Source:
Returns:
This instance, suitable for chaining.

# open()

Programatically opens the dropdown if it is closed.
Source:
Returns:
This instance, suitable for chaining.

# rotate(rad)

Rotates the component.
Parameters:
Name Type Description
rad number The number of radians to rotate the component by.
Overrides:
Source:
Returns:
This instance, suitable for chaining.

# rotateDeg(deg)

Rotates the component.
Parameters:
Name Type Description
deg number The number of degrees to rotate the component by.
Overrides:
Source:
Returns:
This instance, suitable for chaining.

# setDropdownPosition(position)

Gets and sets the position of the dropdown list.
Parameters:
Name Type Description
position string The position where the list will open. Valid values are "bottom" (default) and "top".
Source:
Returns:
This instance, suitable for chaining.

# setEnabled(enabled)

Sets the enabled state of this component.
Parameters:
Name Type Description
enabled boolean Whether or not the component will be enabled.
Overrides:
Source:
Returns:
This instance, suitable for chaining.

# setHeight(height)

Sets the height of this component.
Parameters:
Name Type Description
height number The height of this component.
Overrides:
Source:
Returns:
This instance, suitable for chaining.

# setIndex(index)

Sets the selected index of this _dropdown.
Parameters:
Name Type Description
index number The index to set.
Source:
Returns:
This instance, suitable for chaining.

# setSize(w, h)

Sizes the component.
Parameters:
Name Type Description
w number The new width of the component.
h number The new height of the component.
Overrides:
Source:
Returns:
This instance, suitable for chaining.

# setWidth(width)

Sets the width of this component.
Parameters:
Name Type Description
width number The width of this component.
Overrides:
Source:
Returns:
This instance, suitable for chaining.

# setX(x)

Sets the x position of this component.
Parameters:
Name Type Description
x number The x position of this component.
Overrides:
Source:
Returns:
This instance, suitable for chaining.

# setY(y)

Sets the y position of this component.
Parameters:
Name Type Description
y number The y position of this component.
Overrides:
Source:
Returns:
this instance, suitable for chaining.