Discussion :

[Croquete]

Bonjour,

Je demande de l'aide car j'ai un peu de mal avec JavaScript et je me demandais comment factoriser ce code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
$('label[for="nom_societe"]').css({color: ''});
        if ( jQuery.trim($("#nom_societe").val()).length==0 ) {
            $('label[for="nom_societe"]').css({color: 'red'});
			$("#nom_societe").css({border: '2px solid red'});
            bReturn = false;
        }
 
		$('label[for="nom_interlocuteur"]').css({color: ''});
        if ( jQuery.trim($("#nom_interlocuteur").val()).length==0 ) {
            $('label[for="nom_interlocuteur"]').css({color: 'red'});
			$("#nom_interlocuteur").css({border: '2px solid red'});
            bReturn = false;
        }
 
		$('label[for="adresse"]').css({color: ''});
        if ( jQuery.trim($("#adresse").val()).length==0 ) {
            $('label[for="adresse"]').css({color: 'red'});
			$("#adresse").css({border: '2px solid red'});
            bReturn = false;
        }
 
...

Je pensais faire une boucle avec des variables pour récupérer l'identifiant, le nombre d'id dans le code. Mais il n'y a aucun moyen d'indiquer quel identifiant récupérer parmi tous ceux dans mon code HTML.
Serait-ce impossible de simplifier ce code ?
Merci de votre aide.

[SpaceFrog]

http://jsfiddle.net/EsHQV/

[Croquete]

Ce site permet seulement de tester son code non?

Je voudrais factoriser le code qui oblige la saisie des champs.

[SpaceFrog]

si tu avais lu le code de mon exemple tu aurais vu la factorisation des selecteurs ...

voici un exemple partiel..
http://jsfiddle.net/EsHQV/5/

[danielhagnoul]

Bonsoir

Plusieurs chemins vont à Rome.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function labelInputcolorRed( id ){
    var bReturn = true,
         jObjLabel = $( "label[for='" + id + "']"),
         jObjInput = $( "#" + id );
 
    jObjLabel.css({ "color" : "" });
 
    if ( $.trim( jObjInput.val() ).length == 0 ){
        jObjLabel.css({ "color" : "red" });
        jObjInput.css({ "border" : "2px solid red" });
        bReturn = false;
    }
 
   return bReturn;
}

[Croquete]

Pardon, je n'avais pas vu. Merci de vos réponses, je vais essayer tout de suite vos codes.

[Croquete]

Merci SpaceFrog, c'est impeccable. (bien que je trouve le code un peu difficile). L'utilisation de this induit-il que ça s'apparente à de la prog orientée objet?

Danielhagnoul, sur quoi faut-il que j'applique la fonction?

[danielhagnoul]

Danielhagnoul, sur quoi faut-il que j'applique la fonction?

ID ? Cela ne vous dit donc rien ? Laissez tomber !

[Croquete]

Si, mais il faut que j'appelle labelInputcolorRed( #localisation ) par exemple, dans le corps HTML ?

[danielhagnoul]

Si, mais il faut que j'appelle labelInputcolorRed( #localisation ) par exemple, dans le corps HTML ?

En lisant mon code, vous pouvez facilement vous rendre compte que le symbole croisillon ("hash", #) est inutile mais c'est un "string" donc : labelInputcolorRed( "localisation" ).

[Croquete]

Merci, je vais essayer.
Hum... Je la met où la fonction ?

[SpaceFrog]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$("#nom").parent("p").css({borderLeft: ''});

????? id="nom" oussa ?

[Croquete]

J'ai un très gros problème avec le code javascript (que ça soit l'original ou le factorisé):
tout l'après-midi, sans changer une seul ligne de code, j'ai rafraichi la page et soit:

1)
-on laisse un champs vide
-on valide --> le texte et la case se colore en rouge
-on le remplit --> le texte devient noir, la case garde le bord gauche en rouge mais le bord a l'epaisseur normale et il est IMPOSSIBLE d'envoyer le formulaire: rien ne se passe
soit:
2)
-on laisse un champs vide
-on valide --> le texte et la case se colore en rouge
-on le remplit -->le texte devient noir, la case reste rouge mais le formulaire est envoyé

Les seuls choses que j'ai faites sont de rafraichir la pages en testant de tres nombreuses fois.