Révision et amélioration de 'FormDeflater'
This commit is contained in:
xdrm-brackets
parent
5e6861d9ad
commit
3b4071dda1
|
|
@ -1,3 +1,5 @@
|
|||
function FormDeflater(b,c,a){for(var d=0;d<c.length;d++)c[d]=c[d].toLowerCase();for(d=0;d<a.length;d++)a[d]=a[d].toLowerCase();this.container=b;this.tags=c;this.attr=a}
|
||||
FormDeflater.prototype={container:this.container,tags:this.tags,attr:this.attr,deflate:function(){for(var b=this.getChildren(this.container),b=this.filterElements(b),c={},a=0;a<b.length;a++)for(var d=0;d<this.attr.length;d++){var e=b[a].getAttribute(this.attr[d]);if(null!==e&&0<e.length){c.hasOwnProperty(e)?c[e]instanceof Array?c[e].push({value:b[a].value,status:b[a].checked}):c[e]=[c[e],{value:b[a].value,status:b[a].checked}]:c[e]={value:b[a].value,status:b[a].checked};break}}return c},getChildren:function(b){if(!(b instanceof
|
||||
Element))return[];for(var c=b=[].slice.call(b.children),a=0;a<b.length;a++)c=c.concat([].slice.call(this.getChildren(b[a])));return c},filterElements:function(b){for(var c=[],a=0;a<b.length;a++)-1<this.tags.indexOf(b[a].tagName.toLowerCase())&&c.push(b[a]);return c}};
|
||||
function FormDeflater(b,c,a){for(var d=0;d<c.length;d++)c[d]=c[d].toLowerCase();for(d=0;d<a.length;d++)a[d]=a[d].toLowerCase();this.container=b;this.tags=c;this.attr=a}FormDeflater.prototype={container:this.container,tags:this.tags,attr:this.attr};
|
||||
FormDeflater.prototype.deflate=function(){for(var b=this.getChildren(this.container),b=this.filterElements(b),c={},a=0;a<b.length;a++)for(var d=0;d<this.attr.length;d++){var e=b[a].getAttribute(this.attr[d]);if(null!==e&&0<e.length){c.hasOwnProperty(e)?c[e]instanceof Array?c[e].push({target:b[a],attr:this.attr[d],value:b[a].value,checked:b[a].checked}):c[e]=[c[e],{target:b[a],attr:this.attr[d],value:b[a].value,checked:b[a].checked}]:c[e]={target:b[a],attr:this.attr[d],value:b[a].value,checked:b[a].checked};
|
||||
break}}return c=this.cleanOutput(c)};FormDeflater.prototype.checkable=function(b){return"INPUT"!=b.tagName||-1==["radio","checkbox"].indexOf(b.getAttribute("type").toLowerCase())?!1:!0};
|
||||
FormDeflater.prototype.cleanOutput=function(b){var c={},a;for(a in b)if(b[a]instanceof Array){var d=!0,e=[],f;for(f in b[a])if(this.checkable(b[a][f].target))!0===b[a][f].checked&&e.push(f);else{d=!1;break}if(d)if(1==e.length)c[a]=b[a][e[0]].value;else for(f in c[a]=[],e)c[a].push(b[a][e[f]].value);else for(f in c[a]=[],b[a])c[a].push(b[a][f].value)}else this.checkable(b[a].target)?c[a]=b[a].checked:c[a]=b[a].value;return c};
|
||||
FormDeflater.prototype.getChildren=function(b){if(!(b instanceof Element))return[];for(var c=b=[].slice.call(b.children),a=0;a<b.length;a++)c=c.concat([].slice.call(this.getChildren(b[a])));return c};FormDeflater.prototype.filterElements=function(b){for(var c=[],a=0;a<b.length;a++)-1<this.tags.indexOf(b[a].tagName.toLowerCase())&&c.push(b[a]);return c};
|
||||
|
|
|
|||
|
|
@ -34,132 +34,236 @@ function FormDeflater(container, tags, attr){
|
|||
|
||||
FormDeflater.prototype = {
|
||||
container: this.container, // Contiendra le 'formulaire' (<form> ou autre)
|
||||
tags: this.tags, // Contiendra les balises HTML à ne pas prendre en compte
|
||||
attr: this.attr, // Contiendra la liste des attributs à prendre pour nom (par ordre de priorité)
|
||||
tags: this.tags, // Contiendra les balises HTML à ne pas prendre en compte
|
||||
attr: this.attr // Contiendra la liste des attributs à prendre pour nom (par ordre de priorité)
|
||||
};
|
||||
|
||||
|
||||
|
||||
/* RETOURNE UN OBJET CONTENANT LES DONNÉES DU FORMULAIRE
|
||||
*
|
||||
* @return form<Object> Objet correspondant aux données du formulaire
|
||||
*
|
||||
*/
|
||||
FormDeflater.prototype.deflate = function(){
|
||||
/* [1] On récupère tous les enfants
|
||||
=========================================================*/
|
||||
var children = this.getChildren( this.container );
|
||||
|
||||
/* RETOURNE UN OBJET CONTENANT LES DONNÉES DU FORMULAIRE
|
||||
*
|
||||
* @return form<Object> Objet correspondant aux données du formulaire
|
||||
*
|
||||
*/
|
||||
deflate: function(){
|
||||
/* [1] On récupère tous les enfants
|
||||
=========================================================*/
|
||||
var children = this.getChildren( this.container );
|
||||
|
||||
/* [2] On filtre les éléments qui ont pas le bon tag
|
||||
=========================================================*/
|
||||
children = this.filterElements( children );
|
||||
/* [2] On filtre les éléments qui ont pas le bon tag
|
||||
=========================================================*/
|
||||
children = this.filterElements( children );
|
||||
|
||||
|
||||
/* [3] On essaie de trouver les attributs primants (non vides et en premier dans la liste @this.attr)
|
||||
=========================================================*/
|
||||
/* (0) On initialise l'objet de retour */
|
||||
var object = {};
|
||||
/* [3] On essaie de trouver les attributs primants (non vides et en premier dans la liste @this.attr)
|
||||
=========================================================*/
|
||||
/* (0) On initialise l'objet de retour */
|
||||
var object = {};
|
||||
|
||||
/* (1) Pour chacun des éléments */
|
||||
for( var c = 0 ; c < children.length ; c++ ){
|
||||
/* (1) Pour chacun des éléments */
|
||||
for( var c = 0 ; c < children.length ; c++ ){
|
||||
|
||||
/* (2) Pour chacun des attributs par ordre de priorité */
|
||||
for( var a = 0 ; a < this.attr.length ; a++ ){
|
||||
// On récupère l'attribut
|
||||
var attr = children[c].getAttribute(this.attr[a]);
|
||||
/* (2) Pour chacun des attributs par ordre de priorité */
|
||||
for( var a = 0 ; a < this.attr.length ; a++ ){
|
||||
// On récupère l'attribut
|
||||
var attr = children[c].getAttribute(this.attr[a]);
|
||||
|
||||
/* (3) Si l'attribut n'est pas null ni vide */
|
||||
if( attr !== null && attr.length > 0 ){
|
||||
|
||||
/* (4) Si on a pas déja un champ de même nom */
|
||||
if( object.hasOwnProperty(attr) ){
|
||||
var existing = object[attr];
|
||||
|
||||
// {1} Si l'existant est un tableau, on ajoute notre valeur //
|
||||
if( existing instanceof Array )
|
||||
object[attr].push( { value: children[c].value, status: children[c].checked } );
|
||||
/* (3) Si l'attribut est défini (pas null ni vide) */
|
||||
if( attr !== null && attr.length > 0 ){
|
||||
|
||||
// {2} Sinon, si c'est une valeur seule, on crée un tableau //
|
||||
else
|
||||
object[attr] = [ object[attr], { value: children[c].value, status: children[c].checked } ];
|
||||
/* (4) Si on a pas déja un champ de même nom */
|
||||
if( object.hasOwnProperty(attr) ){
|
||||
var existing = object[attr];
|
||||
|
||||
/* (5) Si c'est le premier champ avec ce nom, on le crée */
|
||||
}else
|
||||
object[attr] = { value: children[c].value, status: children[c].checked };
|
||||
// {1} Si l'existant est un tableau, on ajoute notre valeur //
|
||||
if( existing instanceof Array )
|
||||
object[attr].push( { target: children[c], attr: this.attr[a], value: children[c].value, checked: children[c].checked } );
|
||||
|
||||
// On en a fini pour cet élément
|
||||
break;
|
||||
}
|
||||
// {2} Sinon, si c'est une valeur seule, on crée un tableau //
|
||||
else
|
||||
object[attr] = [ object[attr], { target: children[c], attr: this.attr[a], value: children[c].value, checked: children[c].checked } ];
|
||||
|
||||
/* (5) Si c'est le premier champ avec ce nom, on le crée */
|
||||
}else
|
||||
object[attr] = { target: children[c], attr: this.attr[a], value: children[c].value, checked: children[c].checked };
|
||||
|
||||
// On en a fini pour cet élément
|
||||
break;
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
return object;
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
/* RETOURNE LA LISTE DE TOUS LES ÉLÉMENTS QUEL QUE SOIT LE NIVEAU HIÉRARCHIQUE
|
||||
*
|
||||
* @parent<Element> Parent duquel on veut les enfants
|
||||
*
|
||||
* @return children<Array> Tableau contenant tous les enfants
|
||||
*
|
||||
*/
|
||||
getChildren: function(parent){
|
||||
// Si le parent n'est pas un élément, on retourne aucun enfant
|
||||
if( !(parent instanceof Element) ) return [];
|
||||
|
||||
/* [1] Initialisation des variables
|
||||
=========================================================*/
|
||||
// Contient la liste des enfants directs
|
||||
var children = [].slice.call(parent.children);
|
||||
|
||||
// Contiendra la liste des enfants directs et indirects
|
||||
var allChildren = children;
|
||||
|
||||
/* [2] On parcourt tous les enfants
|
||||
=========================================================*/
|
||||
for( var i = 0 ; i < children.length ; i++ ){
|
||||
// On relance la fonction récursivement sur tous les enfants
|
||||
allChildren = allChildren.concat( [].slice.call(this.getChildren(children[i])) );
|
||||
}
|
||||
|
||||
/* [3] On retourne le résultat
|
||||
=========================================================*/
|
||||
return allChildren;
|
||||
},
|
||||
|
||||
|
||||
|
||||
/* FILTRE LES éléments en fonction de @this.tags et @this.attr
|
||||
*
|
||||
* @elements<Array> Le tableau contenant les éléments à trier
|
||||
*
|
||||
* @return filtered<Array> Retourne le tableau des éléments filtrés
|
||||
*
|
||||
*/
|
||||
filterElements: function(elements){
|
||||
// Contiendra les éléments correspondants aux critères
|
||||
var filtered = [];
|
||||
|
||||
/* [1] On parcourt tous les éléments
|
||||
=========================================================*/
|
||||
for( var i = 0 ; i < elements.length ; i++ ){
|
||||
/* (1) Si l'élément a le bon tag, on le garde */
|
||||
if( this.tags.indexOf( elements[i].tagName.toLowerCase() ) > -1 )
|
||||
filtered.push(elements[i]);
|
||||
}
|
||||
|
||||
/* [3] On retourne les éléments filtrés
|
||||
=========================================================*/
|
||||
return filtered;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* [4] On met en forme les données
|
||||
=========================================================*/
|
||||
object = this.cleanOutput(object);
|
||||
|
||||
|
||||
return object;
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
/* RETOURNE SI UN ELEMENT EST UN BOUTON DE TYPE RADIO/CHECKBOX OU NON
|
||||
*
|
||||
* @element<Element> Element en question
|
||||
*
|
||||
* @return result<Boolean> Renvoie si TRUE or FALSE il en est un
|
||||
*
|
||||
*/
|
||||
FormDeflater.prototype.checkable = function(element){
|
||||
if( element.tagName != 'INPUT' )
|
||||
return false;
|
||||
|
||||
if( ['radio', 'checkbox'].indexOf( element.getAttribute('type').toLowerCase() ) == -1 )
|
||||
return false;
|
||||
|
||||
return true;
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
/* NETTOIE LES DONNÉES EN SORTIE POUR QU'ELLES SOIENT UTILISABLES ET OPTIMISÉES
|
||||
*
|
||||
* @input<Object> Données "brutes"
|
||||
*
|
||||
* @return output<Object> Données sans les valeurs inutiles et explicitées
|
||||
*
|
||||
*/
|
||||
FormDeflater.prototype.cleanOutput = function(input){
|
||||
var output = {};
|
||||
|
||||
/* [1] On parcourt toutes les valeurs récupérées
|
||||
=========================================================*/
|
||||
for( var key in input ){
|
||||
|
||||
/* [2] Si c'est un tableau
|
||||
=========================================================*/
|
||||
if( input[key] instanceof Array ){
|
||||
|
||||
// VRAI si tous les éléments sont radio/checkbox
|
||||
var areCheckable = true;
|
||||
// Contiendra les indices des valeurs ou 'checked=TRUE'
|
||||
var checkedIndexes = [];
|
||||
|
||||
/* (1) On vérifie si tous les champs sont checkables */
|
||||
for( var i in input[key])
|
||||
// si pas checkable, on arrête de vérifier
|
||||
if( !this.checkable(input[key][i].target) ){
|
||||
areCheckable = false;
|
||||
break;
|
||||
// Sinon si checkable et checked=TRUE, on incrémente @nbChecked
|
||||
}else if( input[key][i].checked === true )
|
||||
checkedIndexes.push(i);
|
||||
|
||||
/* (2) Si c'est que des radio ou des checkbox avec une seule valeur à TRUE */
|
||||
if( areCheckable )
|
||||
if( checkedIndexes.length == 1 )
|
||||
output[key] = input[key][checkedIndexes[0]].value;
|
||||
|
||||
/* (3) Si c'est que des radio ou des checkbox avec plusieurs valeurs à TRUE */
|
||||
else{
|
||||
output[key] = [];
|
||||
for( var i in checkedIndexes )
|
||||
output[key].push( input[key][checkedIndexes[i]].value );
|
||||
}
|
||||
|
||||
/* (4) Si c'est pas que des radio ou des checkbox, on met les valeurs */
|
||||
else{
|
||||
output[key] = [];
|
||||
for( var i in input[key] )
|
||||
output[key].push( input[key][i].value );
|
||||
}
|
||||
|
||||
/* [3] S'il n'y a qu'une donnée (pas un tableau)
|
||||
=========================================================*/
|
||||
}else{
|
||||
|
||||
/* (1) Si de type 'radio' ou 'checkbox', on met la valeur de 'checked' */
|
||||
if( this.checkable(input[key].target) )
|
||||
output[key] = input[key].checked;
|
||||
|
||||
/* (2) Sinon, on met la valeur de 'value' */
|
||||
else
|
||||
output[key] = input[key].value;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
return output;
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* RETOURNE LA LISTE DE TOUS LES ÉLÉMENTS QUEL QUE SOIT LE NIVEAU HIÉRARCHIQUE
|
||||
*
|
||||
* @parent<Element> Parent duquel on veut les enfants
|
||||
*
|
||||
* @return children<Array> Tableau contenant tous les enfants
|
||||
*
|
||||
*/
|
||||
FormDeflater.prototype.getChildren = function(parent){
|
||||
// Si le parent n'est pas un élément, on retourne aucun enfant
|
||||
if( !(parent instanceof Element) ) return [];
|
||||
|
||||
/* [1] Initialisation des variables
|
||||
=========================================================*/
|
||||
// Contient la liste des enfants directs
|
||||
var children = [].slice.call(parent.children);
|
||||
|
||||
// Contiendra la liste des enfants directs et indirects
|
||||
var allChildren = children;
|
||||
|
||||
/* [2] On parcourt tous les enfants
|
||||
=========================================================*/
|
||||
for( var i = 0 ; i < children.length ; i++ ){
|
||||
// On relance la fonction récursivement sur tous les enfants
|
||||
allChildren = allChildren.concat( [].slice.call(this.getChildren(children[i])) );
|
||||
}
|
||||
|
||||
/* [3] On retourne le résultat
|
||||
=========================================================*/
|
||||
return allChildren;
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
/* FILTRE LES éléments en fonction de @this.tags et @this.attr
|
||||
*
|
||||
* @elements<Array> Le tableau contenant les éléments à trier
|
||||
*
|
||||
* @return filtered<Array> Retourne le tableau des éléments filtrés
|
||||
*
|
||||
*/
|
||||
FormDeflater.prototype.filterElements = function(elements){
|
||||
// Contiendra les éléments correspondants aux critères
|
||||
var filtered = [];
|
||||
|
||||
/* [1] On parcourt tous les éléments
|
||||
=========================================================*/
|
||||
for( var i = 0 ; i < elements.length ; i++ )
|
||||
// Si l'élément a le bon tag, on le garde
|
||||
if( this.tags.indexOf( elements[i].tagName.toLowerCase() ) > -1 )
|
||||
filtered.push(elements[i]);
|
||||
|
||||
/* [2] On retourne les éléments filtrés
|
||||
=========================================================*/
|
||||
return filtered;
|
||||
};
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -10,7 +10,6 @@
|
|||
class input{
|
||||
|
||||
|
||||
|
||||
/* TRAITE LES DONNÉES D'UN FORMULAIRE DE TYPE TÉLÉPHONIQUE
|
||||
*
|
||||
* @subject<Array> Tableau contenant les données du sujet
|
||||
|
|
@ -121,7 +120,7 @@
|
|||
}
|
||||
|
||||
|
||||
/* [5] Ajout des relations de la matrice
|
||||
/* [4] Ajout des relations de la matrice
|
||||
=========================================================*/
|
||||
// Pour chacun des top 10*2 plus proches
|
||||
foreach($closest as $A=>$rels){
|
||||
|
|
@ -143,10 +142,37 @@
|
|||
}
|
||||
|
||||
|
||||
// TODO : Here !!
|
||||
|
||||
|
||||
|
||||
|
||||
/* [5] Enregistrer les données des FICHES dans la base de données
|
||||
=========================================================*/
|
||||
// TODO: Enregistrer les données des fiches dans la base de données
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/* [6] Enregistrement des mini-fiches dans un fichier '.json'
|
||||
=========================================================*/
|
||||
$file = array();
|
||||
|
||||
/* (1) On enregistre les données des fiches */
|
||||
foreach($mini as $id=>$miniFiche){
|
||||
$data = array(
|
||||
'number' => $contacts[$id]['number'],
|
||||
'username' => $contacts[$id]['username'],
|
||||
'firstname' => $contacts[$id]['firstname'],
|
||||
'lastname' => $contacts[$id]['lastname'],
|
||||
|
||||
// TODO: Finir l'implémentation du fichier XML contenant les données des MINI+des CONTACTS
|
||||
);
|
||||
}
|
||||
|
||||
/* (2) On enregistre les données des mini-fiches */
|
||||
|
||||
|
||||
/* [n] Gestion du retour
|
||||
=========================================================*/
|
||||
return array(
|
||||
|
|
|
|||
|
|
@ -27,10 +27,20 @@ $pers = $request->answer();
|
|||
<input type='password' name='pass1' value='value_pass1'>
|
||||
<input type='number' name='number1' value='value_number1'>
|
||||
|
||||
<input type='radio' data-name='rad1' id='A' value='A'><label for='A'>A</label><br>
|
||||
<input type='radio' data-name='rad1' id='A' value='A' checked><label for='A'>A</label><br>
|
||||
<input type='radio' data-name='rad1' id='B' value='B'><label for='B'>B</label><br>
|
||||
<input type='radio' data-name='rad1' id='C' value='C'><label for='C'>C</label><br>
|
||||
|
||||
<br><br>
|
||||
<input type='radio' data-name='rad2' name='rad2' id='D' value='D' checked><label for='D'>D</label><br>
|
||||
<input type='radio' data-name='rad2' name='rad2' id='E' value='E'><label for='E'>E</label><br>
|
||||
<input type='radio' data-name='rad2' name='rad2' id='F' value='F'><label for='F'>F</label><br>
|
||||
|
||||
<br><br>
|
||||
<input type='radio' data-name='rad3' id='G' value='G'><label for='G'>G</label><br>
|
||||
<input type='checkbox' data-name='chk1' id='H' value='H'><label for='H'>H</label><br>
|
||||
|
||||
<br>
|
||||
<div>
|
||||
<span>
|
||||
<input type='test' values='valuetestHier'>
|
||||
|
|
|
|||
Loading…
Reference in New Issue