# inputEx - CheckBox Usage

## Basic CheckBox creation

Use the following code to create a basic inputEx CheckBox.

new inputEx.CheckBox({parentEl: 'container1'});

## With a label

Add the label

new inputEx.CheckBox({label: 'Do you like inputEx ?', rightLabel: 'Check me !', parentEl: 'container2', value: false});

## Default returned values

In its simplest form, the CheckBox returns true if checked, false otherwise.

var exampleDiv = YAHOO.util.Dom.get('container3'); var field1 = new inputEx.CheckBox({rightLabel: 'I return true/false', parentEl: exampleDiv}); var button = inputEx.cn('button', null, null, 'getValue()'); exampleDiv.appendChild(button); YAHOO.util.Event.addListener(button, 'click', function() { alert(field1.getValue()); });

## Changing the returned values

You can return different values if needed.

var exampleDiv = YAHOO.util.Dom.get('container4'); var field2 = new inputEx.CheckBox({sentValues: ['Yes', 'No'], rightLabel: 'Do you agree ?', parentEl: exampleDiv, value: 'Yes'}); var button = inputEx.cn('button', null, null, 'getValue()'); var button2 = inputEx.cn('button', null, null, 'setValue("No")'); var button3 = inputEx.cn('button', null, null, 'setValue("Yes")'); exampleDiv.appendChild(button); exampleDiv.appendChild(button2); exampleDiv.appendChild(button3); YAHOO.util.Event.addListener(button, 'click', function() { alert(field2.getValue()); }); YAHOO.util.Event.addListener(button2, 'click', function() { field2.setValue('No'); }); YAHOO.util.Event.addListener(button3, 'click', function() { field2.setValue('Yes'); });

## Updated event

How to listen to the updated event :

var el = YAHOO.util.Dom.get('container5'); var field = new inputEx.CheckBox({parentEl: el }); var logDiv = inputEx.cn('div', null, null, "Log :"); el.appendChild(logDiv); field.updatedEvt.subscribe(function() { logDiv.innerHTML += "Updated at "+(new Date())+" with value : "+field.getValue(); logDiv.appendChild(inputEx.cn('br')); });

## Disabling checkboxes

How to enable/disable a checkbox :

var dc = new inputEx.CheckBox({label: 'Disable', parentEl: 'container6'}); dc.disable();