PrizmDoc v12.4 - Updated
Module: dropdown

Module: dropdown

A dropdown menu.

Examples
<!--The following HTML includes a dropdown component. An element is specified 
as a dropdown by setting the data-pcc-component attribute to "dropdown". 
The dropdown options must be included as children elements, where the 
data-pcc-value attribute is used to specify the value of each option.-->
<div class="pcc-select" data-pcc-component="dropdown" data-pcc-name="font" data-pcc-default="Arial">
    <div data-pcc-value="Arial">Arial</div>
    <div data-pcc-value="Comic Sans">Comic Sans</div>
    <div data-pcc-value="Courier">Courier</div>
    <div data-pcc-value="Courier New">Courier New</div>
    <div data-pcc-value="Geneva">Geneva</div>
    <div data-pcc-value="Georgia">Georgia</div>
    <div data-pcc-value="Helvetica">Helvetica</div>
    <div data-pcc-value="Times">Times</div>
    <div data-pcc-value="Times New Roman">Times New Roman</div>
    <div data-pcc-value="Verdana">Verdana</div>
</div>
// Require the dropdown module.
var Dropdown = require('../elements/dropdown.js');

// Pass each dropdown element to the dropdown module to initialize each dropdown.
// parent is the element that contains the dropdown element.
$(parent).find('[data-pcc-component="dropdown"]').each(function() {
    Dropdown(this);
});

(require("dropdown"))(el) → {HTMLElement}

Parses and initializes a dropdown component.

Parameters:
Name Type Description
el HTMLElement

The parent element in which to parse for the dropdown component.

Returns:

The parsed dropdown element.

Type
HTMLElement

Members

off :module:event-store~off

Removes an event handler from the dropdown.

Type:

on :module:event-store~on

Registers an event handler on the dropdown.

Type:

Methods

addOption(val, styleopt) → {Object}

Adds an option to the list of values in the dropdown.

Parameters:
Name Type Attributes Description
val string

The value of the dropdown option.

style string <optional>

The style of the dropdown option.

Returns:

The dropdown element.

Type
Object

destroy()

Destroys the dropdown component.

value(val) → {Object}

Gets or sets the value of the dropdown. The values are specified in the HTML for each dropdown option using the data-pcc-value attribute.

Parameters:
Name Type Description
val string

The value of the dropdown option to select.

Returns:

The dropdown element if a value is passed. Otherwise, the currently selected value is returned.

Type
Object

valueList() → {Array}

Gets an array of the values of the dropdown options.

Returns:

An array of the values of the dropdown options.

Type
Array