Création d'élément fonctionnelle [FCT] reste à gérer le repeat

This commit is contained in:
xdrm-brackets 2016-09-19 12:07:04 +02:00
parent 0867417929
commit 3d5b5acda6
4 changed files with 176 additions and 33 deletions

View File

@ -1,12 +1,15 @@
var ref=function(a,b){for(var e=null;null==e||a.hasOwnProperty(e);)e="$"+(1048576+Math.floor(15728639*Math.random())).toString(16)+"$";a[e]=b;return e},FormBuilder=function(a){this.form_object=a};FormBuilder.prototype={form_object:this.form_object,defs_object:{},parent_element:null,built_form:null,root_element:null,ref_table:{},ref_assoc:{}}; var ref=function(a,b){for(var e=null;null==e||a.hasOwnProperty(e);)e="$"+(268435456+Math.floor(4026531839*Math.random())).toString(16)+"$";a[e]=b;return e},FormBuilder=function(a){this.form_object=a};FormBuilder.prototype={form_object:this.form_object,defs_object:{},parent_element:null,built_form:null,root_element:null,ref_table:{},ref_assoc:{}};
FormBuilder.regex={reg_in_key:/^\/\^(.+)\$\/$/,reg_out_val:/\{(\$[1-9])\}/,pri_out_val:/\{([a-z-]+)\}/g,pri_in_key:/^\$([a-z-]+)$/,arr_out_set:/^\{\{([a-z-]+)\}\}$/,arr_out_val:/\{([a-z-]+)\.([a-z-]+)\}/g,arr_in_key:/^\$\$([a-z-]+)$/,ref_pri:/^\$[a-f0-9]{6}\$$/};FormBuilder.spread_attr=["children","next_nodes","prev_nodes","attributes","node_link"];FormBuilder.allowed_attr="node node_type next_nodes prev_nodes attributes children text repeat".split(" "); FormBuilder.regex={reg_in_key:/^\/\^(.+)\$\/$/,reg_out_val:/\{(\$[1-9])\}/,pri_out_val:/\{([a-z-]+)\}/g,pri_in_key:/^\$([a-z-]+)$/,arr_out_set:/^\{\{([a-z-]+)\}\}$/,arr_out_val:/\{([a-z-]+)\.([a-z-]+)\}/g,arr_in_key:/^\$\$([a-z-]+)$/,ref_pri:/^\$[a-f0-9]{8}\$$/};FormBuilder.spread_attr="children next_nodes prev_nodes attributes node_link listeners".split(" ");FormBuilder.allowed_attr="node node_type next_nodes prev_nodes attributes children text repeat".split(" ");
FormBuilder.prototype.add_definition=function(a){for(var b in a)this.defs_object[b]=a[b]};FormBuilder.prototype.build=function(a){a=null==a?{}:a;for(var b in a)a[b]=ref(this.ref_table,a[b]),this.ref_assoc[b]=a[b];this.built_form=JSON.parse(JSON.stringify(this.form_object));this.built_form=FormBuilder.formatFormObject(this.built_form,this.defs_object);this.built_form=FormBuilder.replaceStatements(this.built_form,a,this.defs_object,this.ref_table)}; FormBuilder.prototype.add_definition=function(a){for(var b in a)this.defs_object[b]=a[b]};FormBuilder.prototype.build=function(a){a=null==a?{}:a;for(var b in a)a[b]=ref(this.ref_table,a[b]),this.ref_assoc[b]=a[b];this.built_form=JSON.parse(JSON.stringify(this.form_object));this.built_form=FormBuilder.formatFormObject(this.built_form,this.defs_object);this.built_form=FormBuilder.replaceStatements(this.built_form,a,this.defs_object,this.ref_table)};
FormBuilder.prototype.update=function(a){a=null==a?{}:a;for(var b in a)this.ref_assoc.hasOwnProperty(b)&&(this.ref_table[this.ref_assoc[b]]=a[b])};FormBuilder.prototype.attach=function(a){if(!(a instanceof Element)&&null==this.parent_element)return!1;this.parent_element=a instanceof Element?a:this.parent_element};FormBuilder.formatFormObject=function(a,b){if(a.hasOwnProperty("children"))for(var e in a.children)a.children[e].parent=a,FormBuilder.formatFormObject(a.children[e],b);return a}; FormBuilder.prototype.update=function(a){a=null==a?{}:a;for(var b in a)this.ref_assoc.hasOwnProperty(b)&&(this.ref_table[this.ref_assoc[b]]=a[b])};FormBuilder.prototype.attach=function(a){if(!(a instanceof Element)&&null===this.parent_element)return!1;this.parent_element=a instanceof Element?a:this.parent_element;var b;a=FormBuilder.buildElements(this.ref_table,this.built_form);for(b in a.prev)this.parent_element.appendChild(a.prev[b]);this.parent_element.appendChild(a.node);for(b in a.next)this.parent_element.appendChild(a.next[b])};
FormBuilder.fetchNodeDefinition=function(a,b){var e,d;r=FormBuilder.regex.reg_in_key;if("undefined"!=typeof b&&b.hasOwnProperty(a))return{def:b[a]};for(e in b)if(r.test(e)&&(d=new RegExp(e.slice(1,-1)),d.test(a))){matches={};for(d=1;d<RegExp.length&&10>d;d++)matches["$"+d]=RegExp["$"+d];return{def:b[e],scope:matches}}return{}}; FormBuilder.formatFormObject=function(a,b){if(a.hasOwnProperty("children"))for(var e in a.children)a.children[e].parent=a,FormBuilder.formatFormObject(a.children[e],b);return a};FormBuilder.fetchNodeDefinition=function(a,b){var e,c;r=FormBuilder.regex.reg_in_key;if("undefined"!=typeof b&&b.hasOwnProperty(a))return{def:b[a]};for(e in b)if(r.test(e)&&(c=new RegExp(e.slice(1,-1)),c.test(a))){matches={};for(c=1;c<RegExp.length&&10>c;c++)matches["$"+c]=RegExp["$"+c];return{def:b[e],scope:matches}}return{}};
FormBuilder.replaceStatements=function(a,b,e,d){a=a instanceof Object?a:{};b=b instanceof Object?JSON.parse(JSON.stringify(b)):{};var c,f;if(a.hasOwnProperty("scope")&&a.scope instanceof Object)for(c in a.scope)b[c]=a.scope[c];if(a.hasOwnProperty("node")&&"string"==typeof a.node&&(f=FormBuilder.fetchNodeDefinition(a.node,e),f.hasOwnProperty("def")&&(a.node_link=JSON.parse(JSON.stringify(f.def)),f.hasOwnProperty("scope"))))for(c in f.scope)b[c]=f.scope[c];for(c in a)"string"==typeof a[c]&&(a[c]=[a[c]], FormBuilder.replaceStatements=function(a,b,e,c){a=a instanceof Object?a:{};b=b instanceof Object?JSON.parse(JSON.stringify(b)):{};var d,f;if(a.hasOwnProperty("scope")&&a.scope instanceof Object)for(d in a.scope)b[d]=a.scope[d];if(a.hasOwnProperty("node")&&"string"==typeof a.node&&(f=FormBuilder.fetchNodeDefinition(a.node,e),f.hasOwnProperty("def")&&(a.node_link=JSON.parse(JSON.stringify(f.def)),f.hasOwnProperty("scope"))))for(d in f.scope)b[d]=f.scope[d];for(d in a)"string"==typeof a[d]&&(a[d]=[a[d]],
f=FormBuilder.replaceStatementsArray(a[c][0],b),!1!==f?a[c]=f:(a[c]=FormBuilder.replaceStatementsRegex(a[c],b),a[c]=FormBuilder.replaceStatementsPrimary(a[c],b),a[c]=FormBuilder.replaceStatementsArrayValue(a[c],b)));for(c in a)FormBuilder.regex.pri_in_key.test(c)?b[c.substring(1)]=ref(d,a[c]):FormBuilder.regex.arr_in_key.test(c)&&(b[c.substring(2)]=ref(d,a[c]));b=JSON.parse(JSON.stringify(b));for(c in a)if(-1<FormBuilder.spread_attr.indexOf(c))if(a[c]instanceof Array)for(var h in a[c])FormBuilder.replaceStatements(a[c][h], f=FormBuilder.replaceStatementsArray(a[d][0],b),!1!==f?a[d]=f:(a[d]=FormBuilder.replaceStatementsRegex(a[d],b),a[d]=FormBuilder.replaceStatementsPrimary(a[d],b),a[d]=FormBuilder.replaceStatementsArrayValue(a[d],b)));for(d in a)FormBuilder.regex.pri_in_key.test(d)?b[d.substring(1)]=ref(c,a[d]):FormBuilder.regex.arr_in_key.test(d)&&(b[d.substring(2)]=ref(c,a[d]));b=JSON.parse(JSON.stringify(b));for(d in a)if(-1<FormBuilder.spread_attr.indexOf(d))if(a[d]instanceof Array)for(var h in a[d])FormBuilder.replaceStatements(a[d][h],
b,e,d);else a[c]instanceof Object&&FormBuilder.replaceStatements(a[c],b,e,d);return a};FormBuilder.replaceStatementsArray=function(a,b){var e=null,e=FormBuilder.regex.arr_out_set.exec(a);if(null===e)return!1;b.hasOwnProperty(e[1])||(b[e[1]]=[]);return b[e[1]]}; b,e,c);else a[d]instanceof Object&&FormBuilder.replaceStatements(a[d],b,e,c);return a};FormBuilder.replaceStatementsArray=function(a,b){var e=null,e=FormBuilder.regex.arr_out_set.exec(a);if(null===e)return!1;b.hasOwnProperty(e[1])||(b[e[1]]=[]);return b[e[1]]};
FormBuilder.replaceStatementsRegex=function(a,b){var e=FormBuilder.regex.reg_out_val,d=null,c=[],f,h,g,k;for(g=0;g<a.length;g++){m=null;c=[];f=-1;for(h=[];null!==(d=e.exec(a[g]))&&!(f>=e.lastIndex);)f=e.lastIndex,c.push(d);for(d=f=0;d<c.length;d++)k=c[d][1],(0<f||0<c[d].index)&&h.push(a[g].substr(f,c[d].index-f)),b.hasOwnProperty(k)||(b[k]=""),h.push(b[k]),f=c[d].index+c[d][0].length;f<a[g].length&&h.push(a[g].substr(f,a[g].length));a=a.slice(0,g).concat(h).concat(a.slice(g+1))}return a}; FormBuilder.replaceStatementsRegex=function(a,b){var e=FormBuilder.regex.reg_out_val,c=null,d=[],f,h,g,k;for(g=0;g<a.length;g++){m=null;d=[];f=-1;for(h=[];null!==(c=e.exec(a[g]))&&!(f>=e.lastIndex);)f=e.lastIndex,d.push(c);for(c=f=0;c<d.length;c++)k=d[c][1],(0<f||0<d[c].index)&&h.push(a[g].substr(f,d[c].index-f)),b.hasOwnProperty(k)||(b[k]=""),h.push(b[k]),f=d[c].index+d[c][0].length;f<a[g].length&&h.push(a[g].substr(f,a[g].length));a=a.slice(0,g).concat(h).concat(a.slice(g+1))}return a};
FormBuilder.replaceStatementsPrimary=function(a,b){var e=FormBuilder.regex.pri_out_val,d=null,c=[],f,h,g,k;for(g=0;g<a.length;g++){m=null;c=[];f=0;for(h=[];null!==(d=e.exec(a[g]));)c.push(d);for(d=0;d<c.length;d++)k=c[d][1],(0<f||0<c[d].index)&&h.push(a[g].substr(f,c[d].index-f)),b.hasOwnProperty(k)||(b[k]=""),h.push(b[k]),f=c[d].index+c[d][0].length;f<a[g].length&&h.push(a[g].substr(f,a[g].length));a=a.slice(0,g).concat(h).concat(a.slice(g+1))}return a}; FormBuilder.replaceStatementsPrimary=function(a,b){var e=FormBuilder.regex.pri_out_val,c=null,d=[],f,h,g,k;for(g=0;g<a.length;g++){m=null;d=[];f=0;for(h=[];null!==(c=e.exec(a[g]));)d.push(c);for(c=0;c<d.length;c++)k=d[c][1],(0<f||0<d[c].index)&&h.push(a[g].substr(f,d[c].index-f)),b.hasOwnProperty(k)||(b[k]=""),h.push(b[k]),f=d[c].index+d[c][0].length;f<a[g].length&&h.push(a[g].substr(f,a[g].length));a=a.slice(0,g).concat(h).concat(a.slice(g+1))}return a};
FormBuilder.replaceStatementsArrayValue=function(a,b){var e=FormBuilder.regex.arr_out_val,d=null,c=[],f,h,g,k;for(g=0;g<a.length;g++){m=null;c=[];f=0;for(h=[];null!==(d=e.exec(a[g]));)c.push(d);for(d=0;d<c.length;d++)k=c[d][1],(0<f||0<c[d].index)&&h.push(a[g].substr(f,c[d].index-f)),b.hasOwnProperty(k)||(b[k]=""),h.push(b[k]),f=c[d].index+c[d][0].length;f<a[g].length&&h.push(a[g].substr(f,a[g].length));a=a.slice(0,g).concat(h).concat(a.slice(g+1))}return a}; FormBuilder.replaceStatementsArrayValue=function(a,b){var e=FormBuilder.regex.arr_out_val,c=null,d=[],f,h,g,k;for(g=0;g<a.length;g++){m=null;d=[];f=0;for(h=[];null!==(c=e.exec(a[g]));)d.push(c);for(c=0;c<d.length;c++)k=d[c][1],(0<f||0<d[c].index)&&h.push(a[g].substr(f,d[c].index-f)),b.hasOwnProperty(k)||(b[k]=""),h.push(b[k]),f=d[c].index+d[c][0].length;f<a[g].length&&h.push(a[g].substr(f,a[g].length));a=a.slice(0,g).concat(h).concat(a.slice(g+1))}return a};
FormBuilder.readRef=function(a,b){var e,d="";if("string"==typeof b&&FormBuilder.regex.ref_pri.test(b)){for(;"string"==typeof b&&FormBuilder.regex.ref_pri.test(b);)b=a[b];return b}for(e in b)d=FormBuilder.regex.ref_pri.test(b[e])&&a.hasOwnProperty(b[e])?a[b[e]]instanceof Array?d+(""+FormBuilder.readRef(a,a[b[e]])):d+(""+a[b[e]]):d+(""+b[e].toString());return d}; FormBuilder.readRef=function(a,b){var e,c="";if("string"==typeof b&&FormBuilder.regex.ref_pri.test(b)){for(;"string"==typeof b&&FormBuilder.regex.ref_pri.test(b);)b=a[b];return b}for(e in b)c=FormBuilder.regex.ref_pri.test(b[e])&&a.hasOwnProperty(b[e])?a[b[e]]instanceof Array?c+(""+FormBuilder.readRef(a,a[b[e]])):c+(""+a[b[e]]):c+(""+b[e].toString());return c};
FormBuilder.buildElements=function(a,b){var e={prev:[],node:null,next:[]},c,d,f;if(b.hasOwnProperty("prev_nodes"))for(c in b.prev_nodes)e.prev=FormBuilder.buildElements(a,b.prev_nodes[c]);if(b.hasOwnProperty("next_nodes"))for(c in b.next_nodes)e.next=FormBuilder.buildElements(a,b.next_nodes[c]);b.hasOwnProperty("node_type")?e.node=document.createElement(FormBuilder.readRef(a,b.node_type)):b.hasOwnProperty("node_link")&&(f=FormBuilder.buildElements(a,b.node_link),e.prev=e.prev.concat(f.prev),e.node=
f.node,e.next=f.next.concat(e.next));if(b.hasOwnProperty("attributes"))for(c in b.attributes)e.node.setAttribute(c,FormBuilder.readRef(a,b.attributes[c]));b.hasOwnProperty("text")&&(e.node.innerHTML=b.text);if(b.hasOwnProperty("listeners"))for(c in b.listeners)e.node.addEventListener(c,FormBuilder.readRef(a,b.listeners[c].handler),!1);if(b.hasOwnProperty("children"))for(c in b.children){f=FormBuilder.buildElements(a,b.children[c]);for(d in f.prev)e.node.appendChild(f.prev[d]);e.node.appendChild(f.node);
for(d in f.prev)e.node.appendChild(f.next[d])}return e};

View File

@ -13,7 +13,7 @@ var ref = function(ref_table, variable){
var key = null; var key = null;
while( key == null || ref_table.hasOwnProperty(key) ) while( key == null || ref_table.hasOwnProperty(key) )
key = '$'+ ( 0x100000+Math.floor( Math.random()*0xefffff) ).toString(16)+'$'; key = '$'+ ( 0x10000000+Math.floor( Math.random()*0xefffffff) ).toString(16)+'$';
/* (2) On attribue la valeur */ /* (2) On attribue la valeur */
ref_table[key] = variable; ref_table[key] = variable;
@ -22,8 +22,6 @@ var ref = function(ref_table, variable){
return key; return key;
}; };
// Lecteur de référence
@ -73,7 +71,6 @@ FormBuilder.prototype = {
}; };
/* DEFINITION DES ATTRIBUTS STATIQUES /* DEFINITION DES ATTRIBUTS STATIQUES
* *
*/ */
@ -88,7 +85,7 @@ FormBuilder.regex = {
arr_out_val: /\{([a-z-]+)\.([a-z-]+)\}/g, // Regex associée à une valeur de tableau à remplacer (primitif) arr_out_val: /\{([a-z-]+)\.([a-z-]+)\}/g, // Regex associée à une valeur de tableau à remplacer (primitif)
arr_in_key: /^\$\$([a-z-]+)$/, // Regex associée à la clé d'un tableau arr_in_key: /^\$\$([a-z-]+)$/, // Regex associée à la clé d'un tableau
ref_pri: /^\$[a-f0-9]{6}\$$/ // Clé de référence ref_pri: /^\$[a-f0-9]{8}\$$/ // Clé de référence
}; };
FormBuilder.spread_attr = [ // Liste des attributs diffusant le scope FormBuilder.spread_attr = [ // Liste des attributs diffusant le scope
@ -96,7 +93,8 @@ FormBuilder.spread_attr = [ // Liste des attributs diffusant le scope
'next_nodes', // diffuse aux éléments 'next_nodes', // diffuse aux éléments
'prev_nodes', // diffuse aux éléments 'prev_nodes', // diffuse aux éléments
'attributes', // diffuse aux attributs 'attributes', // diffuse aux attributs
'node_link' 'node_link',
'listeners'
]; ];
FormBuilder.allowed_attr = [ // Liste des attributs fixes autorisés FormBuilder.allowed_attr = [ // Liste des attributs fixes autorisés
@ -208,16 +206,30 @@ FormBuilder.prototype.attach = function(parent){
/* [0] Initialisation /* [0] Initialisation
=========================================================*/ =========================================================*/
/* (1) Gestion du paramètre @parent */ /* (1) Gestion du paramètre @parent */
if( !(parent instanceof Element) && this.parent_element == null ) if( !(parent instanceof Element) && this.parent_element === null )
return false; return false;
this.parent_element = (parent instanceof Element) ? parent : this.parent_element; this.parent_element = (parent instanceof Element) ? parent : this.parent_element;
// TODO: Gestion de la création des éléments HTML
/* [1] Chapter Title var i;
/* [1] On construit le DOM
=========================================================*/ =========================================================*/
var dom = FormBuilder.buildElements(this.ref_table, this.built_form);
} /* (1) On ajoute les éléments précédents */
for( i in dom.prev )
this.parent_element.appendChild( dom.prev[i] );
/* (2) On ajoute l'élément cible */
this.parent_element.appendChild( dom.node );
/* (3) On ajoute les éléments suivants */
for( i in dom.next )
this.parent_element.appendChild( dom.next[i] );
};
/************************************************/ /************************************************/
@ -777,3 +789,123 @@ FormBuilder.readRef = function(ref_table, parts){
return built; return built;
}; };
/* CONSTRUIT UN ELEMENT A PARTIR D'UNE DEFINITION
*
* @ref_table<Object> Objet contenant les références
* @definition<Object> Objet de définition de l'élément
*
* @return built<Element[]> Retourne les éléments construits
*
*/
FormBuilder.buildElements = function(ref_table, definition){
/* [0] Initialisation
===========================================================*/
var built = {
prev: [], // Les éléments précédents
node: null, // L'éléments actuel et ses antécédents/+ prédécesseurs
next: [] // Les éléments suivants
};
var i, j, tmp;
/* [1] On construit les éléments @prev_nodes, s'ils existent
===========================================================*/
if( definition.hasOwnProperty('prev_nodes') )
for( i in definition.prev_nodes )
built.prev = FormBuilder.buildElements(ref_table, definition.prev_nodes[i]);
/* [2] On construit les éléments @next_nodes s'ils existent
===========================================================*/
if( definition.hasOwnProperty('next_nodes') )
for( i in definition.next_nodes )
built.next = FormBuilder.buildElements(ref_table, definition.next_nodes[i]);
/* [3] On construit l'objet actuel
===========================================================*/
/* (1) On crée l'élément
---------------------------------------------------------*/
/* (1) Si on a le type de <tag> hmtl */
if( definition.hasOwnProperty('node_type') )
built.node = document.createElement( FormBuilder.readRef(ref_table, definition.node_type) );
/* (2) Si c'est un sub-node, on récupère la définition récursivement */
else if( definition.hasOwnProperty('node_link') ){
tmp = FormBuilder.buildElements(ref_table, definition.node_link);
/* On ajoute les éléments à l'instance actuelle */
built.prev = built.prev.concat( tmp.prev );
built.node = tmp.node;
built.next = tmp.next.concat( built.next );
}
/* (2) On ajoute les attributs
---------------------------------------------------------*/
if( definition.hasOwnProperty('attributes') ){
// Pour chaque attribut, on définit
for( i in definition.attributes )
built.node.setAttribute( i, FormBuilder.readRef(ref_table, definition.attributes[i]) );
}
/* (3) On ajoute le contenu HTML
---------------------------------------------------------*/
if( definition.hasOwnProperty('text') ){
// Note: Override les enfants
built.node.innerHTML = definition.text;
}
/* (4) On ajoute les listeners
---------------------------------------------------------*/
if( definition.hasOwnProperty('listeners') ){
for( i in definition.listeners ){
built.node.addEventListener(
i,
FormBuilder.readRef(ref_table, definition.listeners[i].handler),
false
);
}
}
/* [4] On ajoute tous les enfants
=========================================================*/
if( definition.hasOwnProperty('children') )
/* (1) Pour chaque enfant */
for( i in definition.children ){
tmp = FormBuilder.buildElements(ref_table, definition.children[i]);
/* (2) On ajoute les éléments précédent l'enfant */
for( j in tmp.prev )
built.node.appendChild( tmp.prev[j] );
/* (3) On ajoute l'enfant */
built.node.appendChild( tmp.node );
/* (4) On ajoute les éléments suivants l'enfant */
for( j in tmp.prev )
built.node.appendChild( tmp.next[j] );
}
return built;
};

View File

@ -1,4 +1,5 @@
document.body.innerHTML="";"use strict"; 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"}},custom_definition={"/^input.([a-z]+)$/":{node:"input",attributes:{type:"{$1}","data-name":"{name}",value:"{value}",placeholder:"{placeholder}"},next_nodes:[{node:"br"}]},"custom-select":{node:"span",attributes:{"class":"select-container nobold"},children:[{node:"select",attributes:{"data-name":"{name}"},children:[{node:"option", 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"}},custom_definition={"/^input.([a-z]+)$/":{node:"input",attributes:{type:"{$1}","data-name":"{name}",value:"{value}",placeholder:"{placeholder}"},next_nodes:[{node:"br"}],listeners:{click:"{clicklistener}"}},"custom-select":{node:"span",attributes:{"class":"select-container nobold"},children:[{node:"select",attributes:{"data-name":"{name}"},
attribute:{value:"{options.value}"},text:"{options.value}",repeat:"{{options}}"}]}],next_nodes:[{node:"br"}]}},form={node:"h4",attributes:{"data-icon":"o","class":"new-contact color2"},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:"{countcall}"},{node:"input.hidden",$name:"countsms",$value:"{countsms}"},{node:"input.hidden",$name:"total",$value:"xx{countcall} calls + {countsms} sms to {number}xx"}, children:[{node:"option",attribute:{value:"{options.value}"},text:"{options.value}",repeat:"{{options}}"}]}],next_nodes:[{node:"br"}]}},form={node:"h4",attributes:{"data-icon":"o","class":"new-contact color2"},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:"{countcall}"},{node:"input.hidden",$name:"countsms",$value:"{countsms}"},{node:"input.hidden",
{node:"input.text",$name:"number",$value:"{number}"},{node:"custom-select",$name:"existing",$$options:"{{options}}"}]},fb=new FormBuilder(form);fb.add_definition(default_definition);fb.add_definition(custom_definition);fb.build({uid:1,call:2,sms:3,countcall:4,countsms:5,number:"01 02 03 04 05",options:["a","b","c","d"]});console.log(fb.built_form);var str=function(a){return FormBuilder.readRef(fb.ref_table,a)}; $name:"total",$value:"xx{countcall} calls + {countsms} sms to {number}xx"},{node:"input.text",$name:"number",$value:"{number}",$clicklistener:"{clicklistener}"},{node:"custom-select",$name:"existing",$$options:"{{options}}"}]},fb=new FormBuilder(form);fb.add_definition(default_definition);fb.add_definition(custom_definition);fb.build({uid:1,call:2,sms:3,countcall:4,countsms:5,number:"01 02 03 04 05",options:["a","b","c","d"],clicklistener:function(a){console.log(a)}});console.log(fb.built_form);
var str=function(a){return FormBuilder.readRef(fb.ref_table,a)};fb.attach(document.body);

View File

@ -23,7 +23,10 @@ var custom_definition = {
'value': '{value}', 'value': '{value}',
'placeholder': '{placeholder}' 'placeholder': '{placeholder}'
}, },
next_nodes: [{ node: 'br' }] next_nodes: [{ node: 'br' }],
listeners: {
'click': '{clicklistener}'
}
}, },
@ -60,7 +63,7 @@ var form = {
{ node: 'input.hidden', $name: 'countsms', $value: '{countsms}' }, { node: 'input.hidden', $name: 'countsms', $value: '{countsms}' },
{ node: 'input.hidden', $name: 'total', $value: 'xx{countcall} calls + {countsms} sms to {number}xx' }, { node: 'input.hidden', $name: 'total', $value: 'xx{countcall} calls + {countsms} sms to {number}xx' },
{ node: 'input.text', $name: 'number', $value: '{number}' }, { node: 'input.text', $name: 'number', $value: '{number}', $clicklistener: '{clicklistener}' },
{ node: 'custom-select', $name: 'existing', $$options: '{{options}}' } { node: 'custom-select', $name: 'existing', $$options: '{{options}}' }
] ]
@ -82,8 +85,12 @@ fb.build({
countcall: 4, countcall: 4,
countsms: 5, countsms: 5,
number: '01 02 03 04 05', number: '01 02 03 04 05',
options: ['a', 'b', 'c', 'd'] options: ['a', 'b', 'c', 'd'],
clicklistener: function(e){
console.log(e);
}
}); });
console.log(fb.built_form); console.log(fb.built_form);
var str = function(attr){ return FormBuilder.readRef(fb.ref_table, attr); }; var str = function(attr){ return FormBuilder.readRef(fb.ref_table, attr); };
fb.attach(document.body);