Class: CheckboxInputWidget

.ui.CheckboxInputWidget(configopt)

new CheckboxInputWidget(configopt)

CheckboxInputWidgets, like HTML checkboxes, can be selected and/or configured with a value. Note that these input widgets are best laid out in field layouts that use the inline alignment. For more information, please see the [OOUI documentation on MediaWiki][1]. This widget can be used inside an HTML form, such as a OO.ui.FormLayout.
Parameters:
Name Type Attributes Description
config Object <optional>
Configuration options
Properties
Name Type Attributes Default Description
selected boolean <optional>
false Select the checkbox initially. By default, the checkbox is not selected.
Source:
Example
// An example of selected, unselected, and disabled checkbox inputs
    var checkbox1=new OO.ui.CheckboxInputWidget( {
         value: 'a',
         selected: true
    } );
    var checkbox2=new OO.ui.CheckboxInputWidget( {
        value: 'b'
    } );
    var checkbox3=new OO.ui.CheckboxInputWidget( {
        value:'c',
        disabled: true
    } );
    // Create a fieldset layout with fields for each checkbox.
    var fieldset = new OO.ui.FieldsetLayout( {
        label: 'Checkboxes'
    } );
    fieldset.addItems( [
        new OO.ui.FieldLayout( checkbox1, { label: 'Selected checkbox', align: 'inline' } ),
        new OO.ui.FieldLayout( checkbox2, { label: 'Unselected checkbox', align: 'inline' } ),
        new OO.ui.FieldLayout( checkbox3, { label: 'Disabled checkbox', align: 'inline' } ),
    ] );
    $( 'body' ).append( fieldset.$element );

[1]: https://www.mediawiki.org/wiki/OOUI/Widgets/Inputs

Extends

Methods

getClosestScrollableElementContainer() → {HTMLElement}

Get closest scrollable container.
Inherited From:
Source:
Returns:
Closest scrollable container
Type
HTMLElement

getData() → {Mixed}

Get element data.
Inherited From:
Source:
Returns:
Element data
Type
Mixed

getElementDocument() → {HTMLDocument}

Get the DOM document.
Inherited From:
Source:
Returns:
Document object
Type
HTMLDocument

getElementGroup() → {OO.ui.mixin.GroupElement|null}

Get group element is in.
Inherited From:
Source:
Returns:
Group element, null if none
Type
OO.ui.mixin.GroupElement | null

getElementId() → {string}

Ensure that the element has an 'id' attribute, setting it to an unique value if it's missing, and return its value.
Inherited From:
Source:
Returns:
Type
string

getElementWindow() → {Window}

Get the DOM window.
Inherited From:
Source:
Returns:
Window object
Type
Window

(protected) getInputElement(config) → {jQuery}

Get input element. Subclasses of OO.ui.InputWidget use the `config` parameter to produce different elements in different circumstances. The element must have a `value` property (like form elements).
Parameters:
Name Type Description
config Object Configuration options
Overrides:
Source:
Returns:
Input element
Type
jQuery

getInputId() → {string|null}

Get an ID of a labelable node which is part of this widget, if any, to be used for `
Inherited From:
Source:
Returns:
The ID of the labelable element
Type
string | null

getTagName() → {string}

Get the HTML tag name. Override this method to base the result on instance information.
Inherited From:
Source:
Returns:
HTML tag name
Type
string

getValue() → {string}

Get the value of the input.
Inherited From:
Source:
Returns:
Input value
Type
string

isDisabled() → {boolean}

Check if the widget is disabled.
Inherited From:
Source:
Returns:
Widget is disabled
Type
boolean

isElementAttached() → {boolean}

Check if the element is attached to the DOM
Inherited From:
Source:
Returns:
The element is attached to the DOM
Type
boolean

isSelected() → {boolean}

Check if this checkbox is selected.
Source:
Returns:
Checkbox is selected
Type
boolean

isVisible() → {boolean}

Check if element is visible.
Inherited From:
Source:
Returns:
element is visible
Type
boolean

(protected) restorePreInfuseState(state)

Restore the pre-infusion dynamic state for this widget. This method is called after #$element has been inserted into DOM. The parameter is the return value of #gatherPreInfuseState.
Parameters:
Name Type Description
state Object
Overrides:
Source:

scrollElementIntoView(configopt) → {jQuery.Promise}

Scroll element into view.
Parameters:
Name Type Attributes Description
config Object <optional>
Configuration options
Inherited From:
Source:
Returns:
Promise which resolves when the scroll is complete
Type
jQuery.Promise

setData(data)

Set element data.
Parameters:
Name Type Description
data Mixed Element data
Inherited From:
Source:

setDir(dir)

Set the directionality of the input.
Parameters:
Name Type Description
dir string Text directionality: 'ltr', 'rtl' or 'auto'
Inherited From:
Source:

setDisabled(disabled)

Set the 'disabled' state of the widget. When a widget is disabled, it cannot be used and its appearance is updated to reflect this state.
Parameters:
Name Type Description
disabled boolean Disable widget
Inherited From:
Source:

setElementGroup(group)

Set group element is in.
Parameters:
Name Type Description
group OO.ui.mixin.GroupElement | null Group element, null if none
Inherited From:
Source:

setElementId(id)

Set the element has an 'id' attribute.
Parameters:
Name Type Description
id string
Inherited From:
Source:

setInputId(id)

Set the 'id' attribute of the `` element.
Parameters:
Name Type Description
id string
Inherited From:
Source:

setSelected(state)

Set selection state of this checkbox.
Parameters:
Name Type Description
state boolean `true` for selected
Source:

setValue(value)

Set the value of the input.
Parameters:
Name Type Description
value string New value
Inherited From:
Source:
Fires:

simulateLabelClick()

Simulate the behavior of clicking on a label (a HTML `
Overrides:
Source:

supports(methods) → {boolean}

Check if element supports one or more methods.
Parameters:
Name Type Description
methods string | Array.<string> Method or list of methods to check
Inherited From:
Source:
Returns:
All methods are supported
Type
boolean

toggle(showopt)

Toggle visibility of an element.
Parameters:
Name Type Attributes Description
show boolean <optional>
Make element visible, omit to toggle visibility
Inherited From:
Source:
Fires:
  • event:visible

updateDisabled()

Update the disabled state, in case of changes in parent widget.
Inherited From:
Source:

updateThemeClasses()

Update the theme-provided classes.
Inherited From:
Source: