validation de formulaire

Le 6/29/09 9:18 AM, J-F Portala a écrit :

Bonjour,
je travaille en php et
je suis en train d'essayer d'utiliser prototype.
Pour la validation de formulaires, j'ai deux possibilités qui me semblent
intéressantes:
livevalidation

Suis allé voir ce LiveValidation,
bon! ... Ben! ... sur l'exemple je crois qu'en situation d'utilisateur
toute cette agitation latérale me fatiguerait assez rapidement.

Je n'ai pas vu de "prototype" ici :
<http://www.livevalidation.com/examples>
mais autant ce livevalidation_standalone embarque protosysmique ?

Méhouvaton ?
page de démo ci-haut :
64kb de JS pour 12kb de "contenu"
(ou en non compressé: 183kb pour 30kb)

et
jsvalidation (de dexagogo)

Pas trouvé.
Mais l'autre a l'air assez facile à dompter.

Est ce qu'une des deux solutions est plus efficace ou plus souple que
l'autre.

c'est à dire que si :

function verif(f) {
var n = f.length,
x = function(o) {
o=o.parentNode;
while(o.tagName!='LABEL') o=o.parent.node;
return o;
}
while(n-) {
if(f[n].type=='txt') {
x(f[n]).className = 'decoEl';
if(f[n].value.length<1) {
x(f[n]).className = 'infoEl';
f[n].focus();
f[n].select();
return false;
}
}
}
return true;
}

<form onsubmit="return verif(this)" blabla>
<label class="decoEl">
Nom:
<input name="nom" type="text">
<span>Ce champ doit être complété !</span>
</label>
... / ...


ne suffit pas,
allonzydonc pour les 4kb(12kb) du standalone.
(mais là ils n'abordent pas la partie php)
(ça existe un LiveValidation en php ?)

--
sm

Bonjour et merci de ton opinion
Voici le lien concernant jsvalidation
http://tetlaw.id.au/view/javascript/really-easy-field-validation

Je comprends tes réticences quant au poids de ces outils.
En revanche, j'en avais un peu assez de recoder en moins bien des fonctions
qui existent, d'où ma recherche
sur prototype et outils de validation associés.
Ce qui manque encore, c'est aussi la validation au vol des champs saisis
(entier signé ou non, decimal...)

Il y aussi l'aspect ajax qui m'intéresse. Modifier par exemple les
caractéristiques d'un article dans une liste plutot que d'appeler un
formulaire,
le mettre à jour et revenir dans la liste (pas toujours au bon endroit) me
parait assez efficace.

Je trouve Pear difficilement exploitable, j'avais l'impression que formatter
déjà la partie javascript
serait un plus.

Je travaille uniquement en intranet.

Je suis ouvert à jeter un oeil sur tout mode de programmation ou outils.

Jeff

PS : dans ton bout de code, j'ai compris que tu parcourais tous les champs
du formulaire mais je n'arrive pas à comprendre
var n = f.length,
x = function(o) {
o=o.parentNode;
while(o.tagName!='LABEL') o=o.parent.node;
return o;
}



"SAM" <stephanemoriaux.NoAdmin@wanadoo.fr.invalid> a écrit dans le message
de news: 4a489ac5$0$17078$ba4acef3@news.orange.fr...

Le 6/29/09 9:18 AM, J-F Portala a écrit :

Bonjour,
je travaille en php et
je suis en train d'essayer d'utiliser prototype.
Pour la validation de formulaires, j'ai deux possibilités qui me semblent
intéressantes:
livevalidation

Suis allé voir ce LiveValidation,
bon! ... Ben! ... sur l'exemple je crois qu'en situation d'utilisateur
toute cette agitation latérale me fatiguerait assez rapidement.

Je n'ai pas vu de "prototype" ici :
<http://www.livevalidation.com/examples>
mais autant ce livevalidation_standalone embarque protosysmique ?

Méhouvaton ?
page de démo ci-haut :
64kb de JS pour 12kb de "contenu"
(ou en non compressé: 183kb pour 30kb)

et
jsvalidation (de dexagogo)

Pas trouvé.
Mais l'autre a l'air assez facile à dompter.

Est ce qu'une des deux solutions est plus efficace ou plus souple que
l'autre.

c'est à dire que si :

function verif(f) {
var n = f.length,
x = function(o) {
o=o.parentNode;
while(o.tagName!='LABEL') o=o.parent.node;
return o;
}
while(n-) {
if(f[n].type=='txt') {
x(f[n]).className = 'decoEl';
if(f[n].value.length<1) {
x(f[n]).className = 'infoEl';
f[n].focus();
f[n].select();
return false;
}
}
}
return true;
}

<form onsubmit="return verif(this)" blabla>
<label class="decoEl">
Nom:
<input name="nom" type="text">
<span>Ce champ doit être complété !</span>
</label>
... / ...


ne suffit pas,
allonzydonc pour les 4kb(12kb) du standalone.
(mais là ils n'abordent pas la partie php)
(ça existe un LiveValidation en php ?)

--
sm

Le 6/30/09 12:17 PM, J-F Portala a écrit :

PS : dans ton bout de code, j'ai compris que tu parcourais tous les champs
du formulaire mais je n'arrive pas à comprendre
var n = f.length,
x = function(o) {
o=o.parentNode;
while(o.tagName!='LABEL') o=o.parent.node;
return o;
}

c'est (corrigé) :
x = function(o) { // pour trouver le label de l'élément
o = o.parentNode;
while(o && o.tagName!='LABEL') o = o.parentNode;
return o;
}

'x(o)' est une fonction déclarée dans l'autre, celle verif()
Pas ni + ni - (si c'est ça la question ?)

Pour voir, comprendre mon idée c'est ici :
<http://cjoint.com/?gEvciYsrJk>
où j'ai un peu compliqué les choses mais guère.

Bien sûr ça peut paraitre finalement un peu lourd à mettre en place,
mais, à mon idée, pas plus qu'avec "livevalidation" qui semble requérir
un JS à côté de chaque input.
(pas vu d'exemple de validation/radios dans "livevalidation", et même je
me demande si c'est possible ? de vérifier des radios)

--
sm

Merci de ta réponse,
je t'avoue que je me sens un peu léger
par rapport au code que tu as écrit dans ton exemple.
J'écris du javascript bien plus basique, et il faut que j'évolue.
Merci pour ton exemple.

Je pense que l'on est obligé de passer du javascript dans chaque élément si
on veut aller plus loin dans la validation, limiter une valeur
par un min ou un max, etc
J'avais essayé de capter l'évenement onkeypress pour ne conserver que les
codes de touches qui allaient bien ( entier signé ou non, decimal...)
Là aussi on est obligé de mettre du javascript pour chaque champ.

Je travaille beaucoup à partir de tables mysql, où assez rapidement, il faut
faire un formulaire pour renseigner ou modifier les tables.
J'ai essayé de créer des fonctions comme celle ci pour saisir des entiers
par exemple.
function
AddInt($label,$name,$size,$unit='',$value='',$readonly=0,$submitúlse)
{
$strread = ( $readonly == 0 ? "" : "readonly" ) ;
print('<div id="row">') ;
print('<span id="label">'.$label.'</span>'."n") ;
if ( $submit )
{
print('<span id="value"><input type="text" name="'.$name.'"
value="'.$value.'" '.$strread.' size='.$size.'
ONKEYPRESS ="if ((event.keyCode < 48 && event.keyCode !=
13) || (event.keyCode > 57) ) event.returnValue = false; else if (
event.keyCode=) event.returnValue = true
;"></span>'."n") ;
}
else
{
print('<span id="value"><input type="text" name="'.$name.'"
value="'.$value.'" '.$strread.' size='.$size.'
ONKEYPRESS ="if ((event.keyCode < 48) || (event.keyCode
> 57) ) event.returnValue = false;"></span>'."n") ;
}
if ( $unit != '' )
print('<span id="unit">'.$unit.'</span>'."n") ;
print('</div>') ;
}
Je me rends compte que je suis quand même obligé de contrôler par javascript
si les valeurs sont correctes en plus du test par caractère. Cela fait deux
appels pour chaque champ.
J'avais lu que dans html5, les types seraient contrôlés à la frappe clavier.

Encore merci de ton aide

Jeff

SAM a écrit :

c'est (corrigé) :
x = function(o) { // pour trouver le label de l'élément
o = o.parentNode;
while(o && o.tagName!='LABEL') o = o.parentNode;
return o;
}

C'est là que j'ai envie de dire « vive do while » ;)

x = function(o) {
if(o instanceof window.Node)
do o = o.parentNode ;
while(o && ! o instanceof window.HTMLLabelElement);
return o;
}

J'utilises instanceof car ce devrait être plus rapide que de comparer
tagName à une chaîne (en fait, instanceof va comparer la référence au
prototype de l'objet de gauche à la référence à l'objet function de droite).

--
Mickaël Wolff aka Lupus Michaelis
http://lupusmic.org

Seeking for a position <http://lupusmic.org/pro/>

Le 6/30/09 11:18 PM, Mickaël Wolff a écrit :

SAM a écrit :

c'est (corrigé) :
x = function(o) { // pour trouver le label de l'élément
o = o.parentNode;
while(o && o.tagName!='LABEL') o = o.parentNode;
return o;
}

C'est là que j'ai envie de dire « vive do while » ;)

x = function(o) {
if(o instanceof window.Node)
do o = o.parentNode ;
while(o && ! o instanceof window.HTMLLabelElement);
return o;
}

J'utilises instanceof car ce devrait être plus rapide que de comparer
tagName à une chaîne

Vraiment ?

(en fait, instanceof va comparer la référence au
prototype de l'objet de gauche à la référence à l'objet function de
droite).

J'a rhen compris à ton instanceof
... déjà que j'ai du mal à me souvenir que typeof existe,
si en plus tu m'en inventes des nouveaux et que tu en expliques
adabresquement le fonctionnement ça ne m'aide pas bp.

et kesskecé ce window.Node mint'nant ?
Pourquoi s'en inquiéter ?

Et là : window.HTMLLabelElement
quels sont les autres HTMLElements de window ?
(HTMLCheckboxElement, HTMLRadioElement ?)

J'investigationne un élément (HTML plus que enfant-de-window) qui à 90%
de chance doit être contenu dans un conteneur 'label'.
De remonter au parentNode de l'élément doit me donner immédiatement ce
'label'.
Le while est juste là au cas où et un peu pour enfoncer le clou

Le seul pb que j'ai avec ma méthode est qu'au cas où il n'y a pas de
label conteneur, le while va remonter jusqu'à window avant de s'avouer
vaincu.

Est-ce que cet instanceof éviterait celà ?


--
sm

SAM a écrit :

J'utilises instanceof car ce devrait être plus rapide que de
comparer tagName à une chaîne

Vraiment ?

Vérifier que deux entiers (les références de chaque objets) sont
égaux est plus rapide que de comparer 2 × tagName.length octets.

(en fait, instanceof va comparer la référence au prototype de l'objet
de gauche à la référence à l'objet function de droite).

J'a rhen compris à ton instanceof

instanceof vérifie que l'objet à sa gauche est prototypé à partir de
l'objet à droite de instanceof.

... déjà que j'ai du mal à me souvenir que typeof existe,

instanceof vérifie la chaîne de prototypage, typeof donne uniquement
le type javascript natif (undefined, function, string, object, number).

si en plus tu m'en inventes des nouveaux et que tu en expliques
adabresquement le fonctionnement ça ne m'aide pas bp.

J'invente pas :D Je vais écrire un article à ce propos, ça me
permettra de clarifier tout ça dans ma tête et de mieux l'expliquer.

et kesskecé ce window.Node mint'nant ?
Pourquoi s'en inquiéter ?

L'ensemble des objets fournis par l'hôte (l'environnement d'exécution
de nos scripts) sont censés être définis comme attributs de l'objet
global (dans notre navigateur, l'objet global est window, référencé this
en dehors de tout contexte local).

Et là : window.HTMLLabelElement
quels sont les autres HTMLElements de window ?
(HTMLCheckboxElement, HTMLRadioElement ?)

Dans ce document imbitable :
<http://www.w3.org/TR/2003/REC-DOM-Level-2-HTML-20030109/html.html> :D

J'investigationne un élément (HTML plus que enfant-de-window) qui à 90%
de chance doit être contenu dans un conteneur 'label'.
De remonter au parentNode de l'élément doit me donner immédiatement ce
'label'.
Le while est juste là au cas où et un peu pour enfoncer le clou

En fait, je parlais de do while car il évite parfois de se répéter.

Le seul pb que j'ai avec ma méthode est qu'au cas où il n'y a pas de
label conteneur, le while va remonter jusqu'à window avant de s'avouer
vaincu.

Est-ce que cet instanceof éviterait celà ?

Non. Je pense qu'il faudrait écrire quelque chose d'un peu plus
sophistiqué. D'ailleurs je viens d'écrire un petit objet qui fait ce
taf, et qui devrait gérer tout les cas. Si tu veux je te l'envoie.

--
Mickaël Wolff aka Lupus Michaelis
http://lupusmic.org

Seeking for a position <http://lupusmic.org/pro/>

Bonjour,
Je reviens un peu à la charge
concernant les validations:
J'en vois à 3 niveaux:
- en capturant l'evenement on keypress (au niveau touche)
- au niveau du type de champ (email - password - entier - entier signé
etc...comment les distinguer )
- au niveau du champ lui même (valeurs min max...)

La routine proposée par Stéphane est intéressante mais est spécifique
name=='email' ou 'pass1'
Comment est ce que l'on peut associer les champs à un type défini.
(je crois que dans les lib js dont je parlais plus haut, ils utilisent des
classes)

A partir de tables, il y a toujours un formulaire à faire , pou créer et
modifier les enregistrements, et je voulais
automatiser la création du code à partir de la description de la table.

Merci de vos opinions

Jeff

J-F Portala a écrit :

Comment est ce que l'on peut associer les champs à un type défini.
(je crois que dans les lib js dont je parlais plus haut, ils utilisent des
classes)

C'est ce qui est sémantiquement le plus correct. À savoir que
l'attribut HTML class contient une liste de mots.

A partir de tables, il y a toujours un formulaire à faire , pou créer et
modifier les enregistrements, et je voulais
automatiser la création du code à partir de la description de la table.

Je pense qu'un fichier de description est plus adapté dans ce cas.

--
Mickaël Wolff aka Lupus Michaelis
http://lupusmic.org

Seeking for a position <http://lupusmic.org/pro/>

"Mickaël Wolff" <mickael.wolff@laposte.net> a écrit dans le message de news:
4a4b43fd$0$416$426a34cc@news.free.fr...

J-F Portala a écrit :

Comment est ce que l'on peut associer les champs à un type défini.
(je crois que dans les lib js dont je parlais plus haut, ils utilisent
des classes)

C'est ce qui est sémantiquement le plus correct. À savoir que l'attribut
HTML class contient une liste de mots.

Est ce que cela veut dire que si je définis un champ
<input type="text" class="signed_int" name="champ1"
id="champ1">valeur_champ1
Je peux récupérer dans le javascript dans une boucle tous les champs ( avec
l'exemple de Stephane
en ajoutant le instanceof ) et faire le test de validation en fonction du
nom de la classe.
Est ce qu'il y a possibilité de par exemple si je veux tester en plus que le
champ doit être superieur à une valeur (50 par exemple)
class=signed_int@superior@50 que je décompose en signed_int superior 50
pour faire le test en même temps

Cela peut aussi dse faire à partir d'un fichier de description de la table.

Jeff