Javascript

Fermé
jah_haile_selassie Messages postés 60 Date d'inscription mardi 31 mars 2009 Statut Membre Dernière intervention 25 juin 2009 - 22 avril 2009 à 15:17
kij_82 Messages postés 4088 Date d'inscription jeudi 7 avril 2005 Statut Contributeur Dernière intervention 30 septembre 2013 - 29 avril 2009 à 17:08
Bonjour,
J'ai deux zones de recherche dans un fichier html, mais j'ai envie de faire en sorte que si l'utilisateur décide de chercher dans la zone1, la zone2 est grisée et inactive. Et de l'autre coté s'il cherche dans la zone2 c'est la zone1 qui est inactive.
Par exemple dans ma page il y'a possibilité de rechercher un enfant en fonction de son nom et possibilité de chercher une famille. Dans tout les cas s'il cherche l'enfant il ne doit plus pouvoir chercher le parent.

Je sais que c'est très vague mais bon je ne saurais le dire mieux. Svp aidez moi...

Merci d'avance and i trust in CCM :)

4 réponses

kij_82 Messages postés 4088 Date d'inscription jeudi 7 avril 2005 Statut Contributeur Dernière intervention 30 septembre 2013 857
22 avril 2009 à 17:16
Bonjour,

A première vue je dirai qu'il faut raisonner ainsi :

- deux champs "enfant" et "parent".
- Raisonnement:

+ Lorsque l'un des champs a le focus :
Il faut regarder s'il est actif (disabled = false) ou non.
S'il n'est pas actif (disabled = true donc), alors on ne fais rien
S'il est actif, alors on met le champ opposé en disable (exemple on clique sur "enfant", "parent" va se griser a cet instant, quelque soit son contenu)

+ Lorsque l'un des champs perd le focus :
Si le contenu du champ en question est vide, alors on rend enable le champ opposé (comme ça si on a écrit rien écrit dans le champ, ou supprimer ce qu'il y avait d'écrit, on peut alors écrire dans le champ opposé)

+ Lors de la soumission du formulaire :
Il faudra vérifier l'état de chacun des champs et prendre celui qui est enable (disabled = false) et récupérer sa valeur.

En javascript, comment cela se fait-il ?

Il faut te faire des fonctions élémentaires que tu appellera sur les différents évênements associé à un champ (onFocus, onBlur qui sont respectivement la prise d'un focus et sa perte)

Formulaire HTML d'exemple simple, deux champs "enfant" et "parent" :
<?php
include "script_js.js";
?>

<BR>
Rechercher un enfant : <input type="text" id="child" value="" onfocus="getFocus(this,'parent')" onblur="lostFocus(this,'parent')"/>
<BR>
Rechercher un parent : <input type="text" id="parent" value="" onfocus="getFocus(this,'child')" onblur="lostFocus(this,'child')"/>
<BR>


Code du fichier javascript (contenant les fonctions) :
<script language="javascript">

function trim (myString){
return myString.replace(/^\s+/g,'').replace(/\s+$/g,'')
} 

function getFocus( _fieldObj_, _targetName_ ){
	
	// --- S'il est actif, on met le champ opposé en inactif
	if ( _fieldObj_.disabled == false ){
		if ( document.getElementById(_targetName_) )
			document.getElementById(_targetName_).disabled = true;
	}
	
}

function lostFocus( _fieldObj_, _targetName_ ){
	
	// --- On récupère le contenu du champ actuel pour voir s'il est vide (fonction 'trim')
	var myTrimValue = trim(_fieldObj_.value);
	// --- On remplace par la valeur trimée (supprime les espace de début et de fin dans le champ
	_fieldObj_.value = myTrimValue;
	// --- Si le champ est vide, on ré-active le champ opposé
	if ( myTrimValue == "" ){
		if ( document.getElementById(_targetName_) )
			document.getElementById(_targetName_).disabled = false;
	}
	
}

</script>


Je pense que le code est suffisamment clair pour ne pas être expliqué à nouveau, si tu as des questions je reste à ta disposition.
0
jah_haile_selassie Messages postés 60 Date d'inscription mardi 31 mars 2009 Statut Membre Dernière intervention 25 juin 2009
24 avril 2009 à 14:30
Salut,
J'ai testé ton code tel quel au variable près. Mais malheureusement rien ne marche :(

J'ai cette erreur->Warning: include(script/script_js.js) [function.include]: failed to open stream: No such file or directory in C:\wamp\www\CG53\EditPlanning.php on line 4

Mon script ne s'ouvre pas, ça ne marche pas chez moi. Merci tout de même de t'être penché sur mon problème
0
jah_haile_selassie Messages postés 60 Date d'inscription mardi 31 mars 2009 Statut Membre Dernière intervention 25 juin 2009
27 avril 2009 à 11:43
T'es encore là kij_82?
stp j'ai posé une nouvelle question. Je veux faire des teste maintenant pour liberer le focus quand la selection a été déjà faite et permettre une autre selection.

Merci à toi
0
kij_82 Messages postés 4088 Date d'inscription jeudi 7 avril 2005 Statut Contributeur Dernière intervention 30 septembre 2013 857 > jah_haile_selassie Messages postés 60 Date d'inscription mardi 31 mars 2009 Statut Membre Dernière intervention 25 juin 2009
27 avril 2009 à 18:06
La solution que je t'ai donné plus haut fonctionne, seulement il faut mettre ton fichier javascript au même endroit que ton fichier PHP, ou alors changé l'instruction suivante en indiquant le bon chemin d'acces à ton fichier javascript :

include "script_js.js";

0
jah_haile_selassie Messages postés 60 Date d'inscription mardi 31 mars 2009 Statut Membre Dernière intervention 25 juin 2009 > kij_82 Messages postés 4088 Date d'inscription jeudi 7 avril 2005 Statut Contributeur Dernière intervention 30 septembre 2013
28 avril 2009 à 09:40
Bonjour,
Oui pour le chemin j'ai compris cela ; j'ai bien indiqué un autre chemin. Mais la je souhaite faire en sorte que dans une liste déroulante lorsque l'utilisateur selectionne un item il y'a possibilité de selectionne après dans une autre liste.
Le code que tu m'as donné permet de faire uniquement un choix mais dans le cas de deux liste déroulante je veux qu'après avoir fait le premier choix et seulement après il peut faire un deuxième choix dans l'autre liste déoulante.

Merci pour l'aide
0
kij_82 Messages postés 4088 Date d'inscription jeudi 7 avril 2005 Statut Contributeur Dernière intervention 30 septembre 2013 857
28 avril 2009 à 17:15
Bonjour,

Ce genre de problème posé est récurrent sur ce forum, cherche un peu, j'ai déjà répondu à des problèmes identiques (deuxième liste de sélection après une première)
0
jah_haile_selassie Messages postés 60 Date d'inscription mardi 31 mars 2009 Statut Membre Dernière intervention 25 juin 2009
29 avril 2009 à 14:45
salut,
j'ai cherché a balle mais rien :( je n'ai rien trouvé; stp un coup de pouce.

J'ai moi même fait des trucs mais ça ne marche pas bien. Mon problème est de trouver cpmment faire avec javascript lorsque j'ai par exemple trois liste déroulantes l'utilisateur doit d'abord faire son premier choix, ensuite son deuxième choix et après son troisième choix. Tant qu'il n'a pas fait le choix précédent il ne peut pas faire le choix suivant c'est-a-dire que les autres liste déroulante reste grisée et inactive.

Merci encore pour l'aide
0
kij_82 Messages postés 4088 Date d'inscription jeudi 7 avril 2005 Statut Contributeur Dernière intervention 30 septembre 2013 857
29 avril 2009 à 17:08
C'est pourtant la même idée que ce que j'ai mis plus haut.

Trois liste a, b et c

Quand a change de valeur,
Si valeur vide (choix par défaut) -> griser les deux autres listes b et c
Si valeur non vide -> dégriser liste b
Quand b change de valeur,
Si valeur vide (choix par défaut) -> grise la troisième liste c
Si valeur non vide -> dégriser liste c
Quand c change de valeur, il n'y a rien a faire.

A toi de reprendre ce que j'ai fais plus haut et d'appliquer le traitement décrit.
0