A5ButtonList Class
Arguments
- containerIdstring
The ID of the element the button list should be rendered in.
- buttonsarray
An array of object containing the text, icon(s), state and value of each button in the button list.
- valueany
The value of the button.
- hideboolean
If true then the button will not appear in the list. The default is false.
- disabledboolean
If true then the button will not appear in the list. The default is false.
- htmlstring
The HTML to put in the button.
- iconstring
The icon to put in the button. See A5.u.icon.
- hoverIconstring
The icon to put in the button when the user hovers over it. See A5.u.icon.
- pressedIconstring
The icon to put in the button when it is pressed. See A5.u.icon.
- disabledIconstring
The icon to put in the button when it is disabled. See A5.u.icon.
- disabledSelectedIconstring
The icon to put in the button when it is disabled and selected. See A5.u.icon.
- tipstring
The TITLE attribute to put in the button that will appear as a tool tip when the user hovers over the button.
- settingsobject
The settings to use to create the button list.
Description
Button list control.
Discussion
The button list control creates a list of buttons that the user can select from. Button lists can be used in much the same way as radio button or checkbox groups.
Example
// assume that bEle is a pointer to an BUTTON element
var colorsBtnList = new A5.ButtonList('colorsButtonList',[
{html: 'Red', value: 'red'},
{html: 'Green', value: 'green'},
{html: 'Blue', value: 'blue'}
],{
theme: 'Alpha',
inputId: 'colors'
});Properties
- themestring
The theme to use on the button.
- overridestring
The overrides to use on the button.
- inputIdstring
The ID of the INPUT into which the value of the button list should be set every time the button list value changes.
- multipleboolean
Whether or not the button list allows multiple values to be selected.
- separatorstring
The separator string to use for combining multiple values when the value is being put into the INPUT specified by A5.ButtonList.inputId.
- allowNullSelectionbooleanstring
Whether or not to allow the button list to have a null selection. The default value of "auto" allows multi-select button lists to have null selections while single-select button lists must have a value selected. This is useful as is prevents double clicking on a button from deselecting the button in a single-select button list.
- fillstring
By default no value is set. If a value of "width" is set then the buttons in the button list will grow to fill the available width. If a value of "height" is set then the buttons in the button list will grow to fill the available height.
- disabledboolean
If set to "true" then the button list will appear disabled. By default the value is false.
- classNamestring
The class name to put on the button list container element.
- nullSelectionClassNamestring
The class name to put on the button list container element when no value is selected.
- object
The settings for the individual buttons in the button list.
- layoutstring
The layout of the button. A value of "icon text" (the default) or "text icon" which will layout the "icon" and "html" horizontally. A value of "icon" or "text" will only use only "icon" or "text" in the layout. A value of "icon/text" or "text/icon" will layout the "icon" and "html" vertically. A value of "icon-text" or "text-icon" will layout the "icon" and "html" horizontally, but align them to the left and right of the button with any additional width consumed in the center of the button. In all cases the "icon" will be automatically dropped if none is specified.
- stylestring
The CSS to put on the button.
- classNamestring
The class name to put on the button.
- firstClassNamestring
The class name to put on the first button in the list.
- middleClassNamestring
The class name to put on buttons in the list that are neither the first or last.
- lastClassNamestring
The class name to put on the last button in the list.
- hoverClassNamestring
The class name to put on the button when the user hovers over it.
- pressedClassNamestring
The class name to put on the button when the user presses it.
- selectedClassNamestring
The class name to put on the button when the button is selected.
- disabledClassNamestring
The class name to put on the button when the button is disabled.
- disabledSelectedClassNamestring
The class name to put on the button when the button is disabled and selected.
- iconStylestring
The CSS to put on the button icon.
- iconClassNamestring
The class name to put on the button icon.
- selectionarray
The indexes of the selected buttons in the button list.
- valuearray
The values of the selected buttons in the button list.
- onSelectfunction
The code to execute when a value is the button list is selected.
- onClickfunction
The code to execute when a button in the button list is clicked.
- onBeforePopulatefunction(buttons)
The code to execute before the button list is populated. If a value of "false" is returned then the populate will not occur.
- buttonsarray
The buttons to populate the button list with.
- onPopulatefunction(buttons)
The code to execute when the button list is populated.
- buttonsarray
The buttons in the button list.
Methods
- appendButtons Method
Append buttons to the button list.
- insertButtons Method
Insert buttons into the button list.
- populate Method
Populate the button list.
- refresh Method
Refresh the button list.
- removeButton Method
Append buttons to the button list.
- setDisabled Method
Set a button or the entire button list disabled.
- setDisplay Method
Set the display state of a button in the button list.
- setValue Method
Set the value of the button list.
- updateButton Method
Update a button in the button list.