Cumuler plusieurs identifiants

[Erwan31]

Bonjour,
j'aimerais ajouter un id à Email (puisqu'il y a un autre champs sur lequel je dois appliquer la condition) mais les syntaxes ['Email, EmailCtc'] ou ['Email','EmailCtc'] ne fonctionnent pas. Je suppose que c'est plus compliqué?

function CheckField(){
 
  if (document.forms['RegisterForm'].elements['Email'].value == '')
	  {
    alert('Adresse email obligatoire !');
    document.forms['RegisterForm'].elements['Email'].focus();
    return false;
  }
 
 

Est ce que la synatxe actuelle vous semble correcte?

[gwyohm]

Avec cette syntaxe

document.forms['RegisterForm'].elements['Email']

Email est l'attribut name de ton controle (input, select, ...). Si tu as plusieurs controles qui ont le même nom, tu obtiens un tableau.
Si tu veux passer par l'id,

document.getElementById(id);

Comme les IDs doivent être uniques, tu n'obtiens bien qu'un élément

[Erwan31]

Ok c'est l'attribut name en effet. Est ce que je peux donc factoriser ma condition avec plusieurs name?

[SpaceFrog]

soit tu reste avec les names en sachant que

document.forms['RegisterForm'].elements['Email']

retourne une collection

 
document.forms['RegisterForm'].elements['Email'][0]
document.forms['RegisterForm'].elements['Email'][1]
../..

soit tu te rabats sur un nommage rationnel avec des ids

 
id="Email1"
id="Email2" 
../..

un id de fant être unique sur la page
et tu utilise un petit code fourni dans les contributions
getElement(s)ById
http://www.developpez.net/forums/d75...filtre-regexp/

[Erwan31]

Merci SpaceFrog.
Avant de poursuivre je précise que je suis un grand débutant du JS et que je ne connais pas grand chose à la syntaxe.
Voila ce que j'ai déclaré mais ça ne fonctionne pas.

if (
	document.forms['RegisterForm'].elements['Email'][0].value == ''
	document.forms['RegisterForm'].elements['EmailCtc'][1].value == '')
	  {
    alert('Adresse email obligatoire !');
    document.forms['RegisterForm'].elements['Email'].focus();
    document.forms['RegisterForm'].elements['EmailCtc'].focus();
    return false;
  }
 

[gwyohm]

if (
	document.forms['RegisterForm'].elements['Email'][0].value == '' ||
	document.forms['RegisterForm'].elements['EmailCtc'][0].value == '')
// Tu n'as qu'un champ EmailCtc, non ?
	  {
    alert('Adresse email obligatoire !');
    document.forms['RegisterForm'].elements['Email'].focus();
    document.forms['RegisterForm'].elements['EmailCtc'].focus();
    // Supprime une des deux lignes au dessus : tu donnes le focus à Email et immédiatement après à EmailCtc
    return false;
  }

[_jey_]

Sinon, tu peux donner un attribut class à tes éléments mail, et faire appel à la fonction getElementsByClassName() pour les récupérer dans un tableau (fonction ci-dessous à copier dans ton code Javascript) :

function getElementsByClassName(className, tag, elm){
	var testClass = new RegExp("(^|s)" + className + "(s|$)");
	var tag = tag || "*";
	var elm = elm || document;
	var elements = (tag == "*" && elm.all)? elm.all : elm.getElementsByTagName(tag);
	var returnElements = [];
	var current;
	var length = elements.length;
	for(var i=0; i<length; i++){
		current = elements[i ];
		if(testClass.test(current.className)){
			returnElements.push(current);
		}
	}
	return returnElements;
}

(Code trouvé ici => http://communaute.medialibs.com/forum/topic-652.html)

Fonction testée sous Unix, mais normalement ça devrait aussi marcher sous Windows.

[Erwan31]

Envoyé par gwyohm

if (
	document.forms['RegisterForm'].elements['Email'][0].value == '' ||
	document.forms['RegisterForm'].elements['EmailCtc'][0].value == '')
// Tu n'as qu'un champ EmailCtc, non ?
	  {
    alert('Adresse email obligatoire !');
    document.forms['RegisterForm'].elements['Email'].focus();
    document.forms['RegisterForm'].elements['EmailCtc'].focus();
    // Supprime une des deux lignes au dessus : tu donnes le focus à Email et immédiatement après à EmailCtc
    return false;
  }

Oui un seul champ EmailCtc mais chaque champs a aussi un id avec le même nom donc ils doivent être uniques:

<input type="text" name="EmailCtc" id="EmailCtc" size="25" maxlength="40" class="txt" value="{$Email}" />

Ton code ne marche pas et je ne comprends pas bien ta deuxième remarque.
La page en question.

@_jey_ Merci mais je suis bien incapable de fusionner cette fonction avec la fonction checkfield sans faire d'erreur de syntaxe ou de logique :-/

[gwyohm]

Je comprends mieux ton problème ; tes champs Email et EmailCtc ne sont pas dans le même formulaire.

if(document.forms['RegisterForm'].elements['Email'].value == '' ||
document.forms['ContactForm'].elements['EmailCtc'].value == '')

Et visiblement s'il n'y a qu'un élément il ne faut pas spécifier l'index...

Cependant, il reste à mon avis un problème fonctionnel :
Quand on s'apprête à soumettre un formulaire (sur les 2 différents), les 2 formulaires sont validés.


Ma remarque du post précédent était juste pour signaler que tu donnais le focus à chacun des champs. Or à un instant t un seul champ peut avoir le focus.

[Erwan31]

Ah ben oui forcément Merci ça marche!

Autre problème:

Depuis que j'ai ajouté l'appel à la fonction checkfield dans le onclick, la fonction de submit n'est plus prise en compte et se trouve remplacée par la lien href (#):
(je ne malheureusement pas passer l'appel dans le href via un javascript:...)

<a onclick="return CheckField(); document.forms['RegisterForm'].submit();" href="#"

[andry.aime]

Salut,
C'est due au return false dans la fonction CheckField().

[gwyohm]

C'est due au return false dans la fonction CheckField().

Non, c'est du au fait que l'instruction de soumission du formulaire ne peut pas être atteinte :

<a onclick="return CheckField(); document.forms['RegisterForm'].submit();" href="#"

Il y a un return sur la premiere instruction.
Par contre il faut s'assurer que CheckField renverra true quand il n'y a pas d'erreur et tu pourras faire

<a onclick="if( CheckField() ) { document.forms['RegisterForm'].submit()};" href="#"

[Erwan31]

Si je supprime les returni false ou que je met ton code (sans le return donc) gwyohm, la suite des instruction s'enchaine (une fois que j'ai validé la première alerte pour OK, la deuxième apparait etc.

[SpaceFrog]

J'ai cru lire plus haut que si il n'y avait qu'un seul element de même name sur la page ou dans le form on pouvait se passer des indexes ..

Je dois contredire cette information.
getElementsByName retourne une collection, meêm si celle ci ne comporte qu'un seul élément il faut passer par les indexes:

 
<body>
<input name="myname" />
</body>
<script>
alert(document.getElementsByName('myname').name)//undefined
alert(document.getElementsByName('myname')[0].name)//myname
</script>
 

[gwyohm]

Envoyé par SpaceFrog

J'ai cru lire plus haut que si il n'y avait qu'un seul element de même name sur la page ou dans le form on pouvait se passer des indexes ..

Je dois contredire cette information.
getElementsByName retourne une collection, meêm si celle ci ne comporte qu'un seul élément il faut passer par les indexes:

Je parlais de document.forms["formName"].elements["jambon"] et non de getElementsByName.
Si je n'ai qu'un champ "jambon" dans mon formulaire, document.forms["formName"].elements["jambon"][0] me renvoie undefined

<html><head><title></title></head>
<body>
<form name="form1">
	<input type="text" name="jambon"/>
	<input type="button" onclick="alert(document.forms['form1'].elements['jambon'][0]);"/>
</form>
<hr/>
<form name="form2">
	<input type="text" name="jambon"/>
	<input type="text" name="jambon"/>
	<input type="button" onclick="alert(document.forms['form2'].elements['jambon'][0]);"/>
</form>
</body>
</html>