/* [0] On efface le =========================================================*/ document.body.innerHTML = ''; "use strict"; var default_definition = { 'input': { node_type: 'input' }, '/^h([1-6])$/': { node_type: 'h{$1}' }, 'br': { node_type: 'br' }, 'option': { node_type: 'option' }, 'select': { node_type: 'select' }, 'span': { node_type: 'span' }, '/^br([0-9]+)$/': { node: 'br', repeat: { n: '{$1}', id: 'brs' } } }; var custom_definition = { '/^input\.([a-z]+)$/': { node: 'input', attributes: { 'type': '{$1}', 'data-name': '{name}', 'value': '{value}', 'placeholder': '{placeholder}' }, listeners: { 'click': '{click_listener()}' } }, 'custom-select': { node: 'span', attributes: { 'class': 'select-container nobold' }, children: [ { node: 'select', attributes: { 'data-name': '{name}' }, children: [ { node: 'option', attributes: { value: '{options:i}' }, text: '{options.value}', browse: { array: '{options[]}', funcs: { 'options.value': '{getoptval()}' } } } ], listeners: { 'change': '{listener()}' } } ] } }; var contactForm = { node: 'h4', attributes: { 'data-icon': 'o', class: 'new-contact colo2' }, children: [ { node: 'input.hidden', $name: 'uid', $value: '{uid}' }, { node: 'input.hidden', $name: 'call', $value: '{call}' }, { node: 'input.hidden', $name: 'sms', $value: '{sms}' }, { node: 'input.hidden', $name: 'countcall', $value: '{count_call}', $click_listener: '{my_listener()}' }, { node: 'input.hidden', $name: 'countsms', $value: '{count_sms}' }, { node: 'input.text', $name: 'number', $value: '{number}' }, { node: 'custom-select', $name: 'existing', $options: '{existing[]}', $listener: '{existingsel()}' }, { node: 'input.text', $name: 'username', $placeholder: '{username_ph}', $value: '{username}'}, { node: 'input.submit', $value: 'Enregistrer', attributes: { class: 'primary sub-number'} } ], next_nodes: [ { node: 'br' } ] }; var a = ("

\n"+ "\t\n"+ "\t\n"+ "\t\n"+ "\t\n"+ "\t\n"+ "\t \n"+ "\t\n"+ "\t ou \n"+ "\t \n"+ "\t\n"+ "

\n\n"); // On active le debug des performances // FormBuilder.debug_time = true; // FormBuilder.debug_time_details = true; var fb = new FormBuilder(contactForm); fb.add_definition(default_definition); fb.add_definition(custom_definition); fb.build({ uid: 1, call: 2, sms: 3, count_call: 4, count_sms: 5, number: '01 02 03 04 05', existing: ['Jean', 'Archibald', 'Daniel', 'Maurice'], username: 'moi-meme', username_ph: 'Pseudo', my_listener: function(e){ console.log('clicked', e); }, existingsel: function(e){ console.log('selected', e); }, getoptval: function(opt){ return opt; } }); fb.attach(document.body);