inputEx - CombineField Usage

Basic CombineField creation

			var field = new Y.inputEx.CombineField({
				parentEl: 'container1', 
				label: 'Your name',
				description: 'Please enter your name',
				fields: [
					{ name: 'firstname', typeInvite: 'firstname' },
					{ name: 'lastname', typeInvite: 'lastname' }
				],
				separators: [false,"   ",false],
				required:true
			});

		   var el = Y.one('#container1');

			var button1 = inputEx.cn('button', null, null, "SetValue with ['Jimi','Hendrix']");
			var val = ['Jimi','Hendrix'];
			el.appendChild(button1);
			Y.one(button1).on('click' ,function() {
			   field.setValue(val);
			   val = (val[0] == 'Jimi') ? ['',''] : ['Jimi','Hendrix'];
			   button1.innerHTML = "SetValue with "+((val[0] == 'Jimi') ? "['Jimi','Hendrix']" : "['','']");
			});

			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'));
			});
		

Basic CombineField creation

			new Y.inputEx.CombineField({
				parentEl: 'container2', 
				label:'Select Datetime :',
				fields: [
					{type: 'date', name: 'date', typeInvite: 'mm/dd/YYYY' },
					{type: 'time', name: 'time' }
				],
				separators: [false," ",false]
			});
		

Field names

The names are automatically set on sub-fields, so that standard forms can work. Click the button and check the URL

	
    new Y.inputEx.Form( {
			fields: [
			{
				name: 'firstVar',
				label: "First variable",
				value: "my-custom-value"
			},
			
			{
				type: 'list',
				label: "My Array",
				maxItems: 4,
				minItems: 1,
				elementType: {
					type: 'combine',
					description: 'Please enter your name',
					name: 'this_is_a_test',
					fields: [
						{ name: 'firstname', typeInvite: 'firstname' },
						{ name: 'lastname', typeInvite: 'lastname' }
					],
					value: ['Jimi','Hendrix'],
					name: "person",
					separators: [false,"   ",false],
				},
				value: [['Jimi','Hendrix'], ['Eric', 'Clapton']],
				name: 'myarray',
				useButtons: true ,
				sortable: true
			}
			
			
			],
      buttons: [{type: 'submit', value: 'Test to send the GET request'}],
			method: 'GET',
			parentEl: 'container3'
		});