inputEx - CheckBox Usage

Basic CheckBox creation

Use the following code to create a basic inputEx CheckBox.

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

With a label

Add the label

			new Y.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 field1 = new Y.inputEx.CheckBox({rightLabel: 'I return true/false', parentEl: 'container3'});
			
			Y.Node.create("").appendTo('#container3').on('click', function() {
				alert( field1.getValue() );
			});

Changing the returned values

You can return different values if needed.


var field2 = new Y.inputEx.CheckBox({sentValues: ['Yes', 'No'], rightLabel: 'Do you agree ?', parentEl: 'container4', value: 'Yes'});


Y.Node.create("").appendTo('#container4').on('click', function() {
  alert( field2.getValue() );
});

Y.Node.create("").appendTo('#container4').on('click', function() {
  field2.setValue('No');
});

Y.Node.create("").appendTo('#container4').on('click', function() {
  field2.setValue('Yes');
});

Updated event

How to listen to the updated event :

			var el = Y.one('#container5');
			var field = new Y.inputEx.CheckBox({parentEl: el });
			var logDiv = inputEx.cn('div', null, null, "Log :");
			el.appendChild(logDiv);
			field.on('updated', function(value) {
				logDiv.innerHTML += "Updated at "+(new Date())+" with value : "+value;
				logDiv.appendChild(inputEx.cn('br'));
			});

Disabling checkboxes

How to enable/disable a checkbox :

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