API Docs for:
Show:

PickList Class

Extends Widget
Module: gallery-picklist

Methods

_clearOptions

() protected

Method to clear the right-hand side "selections" OPTIONS completely.

Returns:

true

_createCssButton

(
  • subname,
  • lcontent,
  • rcontent,
)
HTML protected

Creates an HTML

Parameters:

  • subname, String

    The sub-class name to be added to the button class

  • lcontent, String

    The sub-class name to add to the left-hand side IMG span class

  • rcontent, String

    The sub-class name to add to the right-hand side IMG span class

Returns:

HTML: code for element

_createHtmlButton

(
  • subname,
  • content,
)
HTML protected

Creates an HTML

Parameters:

  • subname, String

    The sub-class name to be appended to the "class" for this button

  • content, String

    The contents of the button face (i.e. "Click Me")

Returns:

HTML: code for element

_createOption

(
  • opt_obj
)
Node protected

Method creates an

Parameters:

  • opt_obj Object

    Object with members "value", "text" and "title"

Returns:

Node: instance of Option object

_createYButtonNode

(
  • bnode,
)
Y.Button protected

Creates a Y.Button object by using the input "bnode" as the srcNode of the Button.

Parameters:

  • bnode, String | | Node

    The Node of the HTML

Returns:

Y.Button: object

_getSelectedOptions

(
  • sel_node,
)
Array protected

Returns all of the HTML element with the user-defined options array.

Returns:

Number: options.length

_onButtonAll

(
  • e,
)
protected

The "Add All" button click handler. Adds all of the "Available" options to the "selected" Options, checking to avoid duplicates. This method checks if the Widget is a "stack", if so, it moves the Option from left to right.

Parameters:

  • e, EventHandle

    The button's Eventhandle from the button .on "click" event

Returns:

nothing

_onButtonAllBack

(
  • e,
)
protected

The "Remove All" button click handler. Removes all of the option(s) from the "Selections" right-side options. This method checks if the Widget is a "stack", if so, it moves the Option from right to left, otherwise it destroys it.

Parameters:

  • e, EventHandle

    The button's Eventhandle from the button .on "click" event

Returns:

nothing

_onButtonBack

(
  • e,
)
protected

The "Remove One" button click handler. Removes the DOM selected option(s) from the "Selections" right-side options. This method checks if the Widget is a "stack", if so, it moves the Option from right to left, otherwise it destroys it.

Parameters:

  • e, EventHandle

    The button's Eventhandle from the button .on "click" event

Returns:

nothing

_onButtonOne

(
  • e,
)
protected

The "Add One" button click handler. Adds the DOM selected option(s) from the "Available" options to the right-hand side HTML elements, and four BUTTONS to operate on the Widget.

The method uses the "template" attribute if set for positioning of the above UI elements, if none is provided a default template is used.

Returns:

true

_returnOptionPerOrder

() protected

Internal method intended to return the provided opt_node object back to the "options" SELECT OPTION in the original defined order. This would only be used for "stackMode" and "preserveOrder" true.

Returns:

_selOptionExists

(
  • opt_node,
)
protected

Utility function to avoid duplicate adding an option to the right-hand side "selections" Options element. This method checks if the "opt_node" already exists in the "selections" Options, if so it returns TRUE, if not it returns FALSE.

Parameters:

  • opt_node, Node

    The Option node to check for existence.

Returns:

true or false, If the opt_node already exists in the Options array

bindUI

() public

Method that binds the button pushes to their handlers. Keep a reference to the handler in this._eventHandles so we can detach them later.

clearOptions

() public

Method to clear the left-hand side "options" SELECT OPTIONS completely.

Returns:

true

clearSelections

() public

Method to clear the right-hand side "selections" SELECT OPTIONS completely.

Returns:

true

getSelections

() Array public

Returns the current items in the "right side" SELECT OPTIONS box.

Returns:

Array: An array of options Objects, members are { value, text, title };

Properties

_eventHandles

Array private

Holder for the "action" click event handlers

_optionNode

Object private

Holder for the Y.Node of the SELECT left-hand side "available" options.

_optOrder

Array private

Holder for the original OPTIONS order, to be used with "preserveOrder" (NOT IMPLEMENTED)

_selectNode

Object private

Holder for the Y.Node of the SELECT right-hand side "selected" or chosen options

_ybuttons

Array private

Holder for the Y.Button Widget instances (if "buttonType" === "ybutton" )

CLASS_ACTION

Object private

TMPL_button

String protected

The template to use for constructing the HTML

TMPL_control

String protected

The default "template" to use for rendering of this widget.

TMPL_cssbtn

String protected

The template to use for constructing the HTML

TMPL_inputs

String protected

The template to use for constructing the HTML elements for left/right side

Attributes

actionLabelAll

String

The label to be used for the BUTTON face for "Add All" action.

Default: 'Add All'

actionLabelOne

String

The label to be used for the BUTTON face for "Add One" action.

Default: 'Add'

actionLabelRmv

String

The label to be used for the BUTTON face for "Remove" action.

Default: 'Remove'

actionLabelRmvAll

String

The label to be used for the BUTTON face for "Remove All" action.

Default: 'Remove All'

buttonType

String

Attribute allows specifying the "button" type to be used during construction of the Widget template. Currently supported are HTML

Default: 'htmlbutton'

optClassName

String

Classname to be applied to the "options" element, usually used to specify the "width" of the element.

Default: ''

selected

Array

The Array to populate the SELECT / OPTIONS on the right-side, herein referred to as "selected" in this widget. For example, if a FORM is opened with default multi-selected items, they would be provided in this attribute as an array.

Elements of this array aren't required to have members { text:'', value:''}, if the members are different they can be mapped to the expected settings using the "optionsMap" attribute.

If the members of this array are non-object single-items, they are assumed to be the "text" item, and the "value" will also be set to this item.

Default: []

selectSize

String

The default "width" style of the left and right side SELECT / OPTIONS control.

Default: '9em'

selectSize

Int

The number of options to display in the left and right side SELECT / OPTIONS control.

Default: 10

srcNode

String

The source "ID" of the container for this widget, REQUIRED.

Default: null

stackMode

Boolean

A flag setting for enabling "stack" mode of this widget. In "stack" mode the JS Options are moved from left-to-right individually, so that they can't be re-used inadvertantly.

For example, "Add One" from the left option MOVES the option to the right-side "selections". If "Remove One" is chosen, the right-side selected item is returned to the bottom of the left-hand side options. (Can't currently return it to the index of where it came from ... see "preserveOrder").

Default: false

template

String

The DOM ID element of the "template" to be used for defining the OPTIONS, SELECTIONS, and the BUTTONS.

Expected replacable placeholder tokens positioned within the "template" are identified as;

{OPTIONS_CONTAINER}     :  Left-hand side "Options" <select> placeholder
{SELECTIONS_CONTAINER}  :  Right-hand side "Selected" <select> placeholder
{ACTION_ALL}            :  Placeholder for the "Add All" button
         {ACTION_ONE}            :  Placeholder for the "Add One" button
{ACTION_BACK}           :  Placeholder for the "Remove One" button
{ACTION_ALLBACK}        :  Placeholder for the "Remove All" button

Default: ''