Liste de choix + input validation des critères et lien

Résolu/Fermé

montail Messages postés 27 Date d'inscription dimanche 24 octobre 2004 Statut Membre Dernière intervention 15 août 2015 - 11 août 2015 à 15:22
montail - 14 août 2015 à 19:27

Bonjour,
Je vais essayer d'être clair.

ça concerne le javascript

J'ai une liste de choix "choix1" et 3 input text "input 1,2 et3"

D'aprés la valeur de choix 1 je dois comparer les valeurs des inputs par rapport à des chiffres pres defini en rapport à choix1.
Ensuite suivant les comparaisons si je suis dessus ou en dessous ça me donne une réponse.

est ce que j'ai été clair ? hum pas sure, en tout cas merci de votre aide

--

A voir également:

Liste de choix + input validation des critères et lien
Liste déroulante excel - Guide
Ethernet n'a pas de configuration ip valide - Guide
Lien url - Guide
Créer un lien pour partager des photos - Guide
Verifier un lien - Guide

4 réponses

Réponse 1 / 4

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
11 août 2015 à 17:31

Salut,

Ce n'est pas forcément très clair en effet, avec quelques exemples ce serait plus compréhensible.

Mais surtout, quelle est ta question ? Où est-ce que tu bloques ? As tu un début de solution à nous montrer ?

Bonne journée

montail
11 août 2015 à 17:45

salut,
j'ai créer la liste de choix, et les inputs.

maintenant je cherche à savoir comment faire pour comparer les valeurs des inputs avec des valeurs definie en rapport au choix.

Par exemple: liste de choix valeur 1 dans ce cas l'input 1 sera à comparer avec la valeur 20, l'input 2 sera à comparer avec la valeur 100 et l'input sera sera à comparer avec la valeur 200.

si le choix est 2 les input seront à comparer avec d'autre valeur de références. etc

ensuite aprés ce controle les 3 input sont additionnées et comparer également à un groupe de valeur pour ensuite afficher le resultat correspondnant .

c'est dur d'expliquer,
j'accompane mon fils au cinéma, (les minions) youppi, et j'essaie de faire plus clair à mon retour

montail
11 août 2015 à 21:20

je reprends.

comment affecter des chiffres de référence à mes données de liste de choix ?
ces 3 chiffres de référence suivant le choix seront comparé aux 3 input (chiffre 1 avec input1, chiffre 2 input 2 etc)

c'est la 1ère étape

montail
11 août 2015 à 23:12

Voila mon code :
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
</head>

<label for="url">Choississez le type de votre établissement ? </label></br>
<SELECT NAME="Type" >
<option value="">-- Quel est le type de votre établissement ---</option>
<option value="Type J"> Type J </option>
<option value="Type L"> Type L </option>
<option value="Type M"> Type M </option>
<option value="Type N "> Type N </option>
<option value="Type O"> Type O </option>
<option value="Type P"> Type P </option>
<option value="Type R"> Type R </option>
<option value="Type S"> Type S </option>
<option value="Type T"> Type T </option>
<option value="Type U"> Type U </option>
<option value="Type V "> Type V </option>
<option value="Type W"> Type W </option>
<option value="Type X"> Type X </option>
<option value="Type Y"> Type Y </option>
<option value="Type OA "> Type OA </option>
<option value="Type PA"> Type PA</option>

</SELECT>
</br></br>
<script language="javascript" type="text/javascript">
function send() {
document.form1.total.value = parseInt(document.form1.valeur_1.value) + parseInt(document.form1.valeur_2.value) + parseInt(document.form1.valeur_3.value);
}
</script>
<form id="form1" name="form1" method="post" action="">
Effectif en sous sol :
<input type="text" name="valeur_1" id="valeur_1" value = "0" onchange="send()"/>
<br /><br />
Effectif au rez-de-chaussée :
<input type="text" name="valeur_2" id="valeur_2" value= "0" onchange="send()"/>
<br /><br />
Effectif en étages :
<input type="text" name="valeur_3" id="valeur_3" value ="0" onchange="send()"/>
<br /><br />
Effectif TOTAL :
<input type="text" name="total" id="total" />
<br />

</form>

Réponse 2 / 4

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
Modifié par Pitet le 12/08/2015 à 09:23

Voici un début de solution pour définir les valeurs de référence en fonction du choix dans la liste déroulante :

<SELECT id="type" name="Type" onchange="changeValeurReference()">
 <option value="">-- Quel est le type de votre établissement ---</option>
 <option value="Type J"> Type J </option>
 <option value="Type L"> Type L </option>
 <option value="Type M"> Type M </option>
 <option value="Type N "> Type N </option>
 <option value="Type O"> Type O </option>
 <option value="Type P"> Type P </option>
 <option value="Type R"> Type R </option>
 <option value="Type S"> Type S </option>
 <option value="Type T"> Type T </option>
 <option value="Type U"> Type U </option>
 <option value="Type V "> Type V </option>
 <option value="Type W"> Type W </option>
 <option value="Type X"> Type X </option>
 <option value="Type Y"> Type Y </option>
 <option value="Type OA "> Type OA </option>
 <option value="Type PA"> Type PA</option>
</SELECT>

<script language="javascript" type="text/javascript">
var valeurReference1 = 0;
var valeurReference2 = 0;
var valeurReference3 = 0;

function changeValeurReference() {
 var typeSelect = document.getElementById('type').value;
 
 switch(typeSelect) {
  case 'Type J':
   valeurReference1 = 1;
   valeurReference2 = 2;
   valeurReference3 = 3;
   break;
  case 'Type L':
   valeurReference1 = 4;
   valeurReference2 = 5;
   valeurReference3 = 5;
   break;
  default:
   break;
 } 
}
</script>

montail
12 août 2015 à 18:04

merci cool,

je rempli, j'adapte je test, et je vous tiens au courant

merci et à très bientôt

montail Messages postés 27 Date d'inscription dimanche 24 octobre 2004 Statut Membre Dernière intervention 15 août 2015
13 août 2015 à 10:55

Re,

j'ai rempli, complété et testé, mais ça ne marche pas !!

je dois faire une erreur quelque part mais je ne sais pas ou,
voici mon code :

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
</head>

<label for="url">Choississez le type de votre établissement ? </label></br>
<SELECT NAME="Type" >
<option value="">-- Quel est le type de votre établissement ---</option>
<option value="Type J personnes agées"> Type J personnes agées</option>
<option value="Type J adultes handicapés"> Type J adultes handicapés</option>
<option value="Type L salle d'auditions, de conférences, de réunions"> Type L salle d'auditions, de conférences, de réunions</option>
<option value="Type L salle de spectacles, de projections ou à usage multiple"> Type L salle de spectacles, de projections ou à usage multiple</option>
<option value="Type M"> Type M </option>
<option value="Type N "> Type N </option>
<option value="Type O"> Type O </option>
<option value="Type P"> Type P </option>
<option value="Type R écoles maternelles, crèches, haltes garderies et jardin d'enfants"> Type R écoles maternelles, crèches, haltes garderies et jardin d'enfants </option>
<option value="Type R autres établissements"> Type R autres établissements</option>
<option value="Type R avec locaux réservé au sommeil"> Type R avec locaux réservé au sommeil</option>
<option value="Type R MAM"> Type R MAM</option>
<option value="Type S"> Type S </option>
<option value="Type T"> Type T </option>
<option value="Type U sans hébergement"> Type U sans hébergement </option>
<option value="Type U avec hébergement"> Type U sans hébergement </option>
<option value="Type V "> Type V </option>
<option value="Type W"> Type W </option>
<option value="Type X"> Type X </option>
<option value="Type Y"> Type Y </option>
<option value="Type OA "> Type OA </option>
<option value="Type PA"> Type PA</option>

</SELECT>

<script language="javascript" type="text/javascript">
var valeurReference1 = 0;
var valeurReference2 = 0;
var valeurReference3 = 0;

function changeValeurReference() {
<script language="javascript" type="text/javascript">
var typeSelect = document.getElementById('type').value;

switch(typeSelect) {
case 'Type J personnes agées':
valeurReference1 = 25;
valeurReference2 = 25;
valeurReference3 = 25;
break;
case 'Type J adultes handicapés':
valeurReference1 = 20;
valeurReference2 = 20;
valeurReference3 = 20;
break;
case 'Type L salle d'auditions, de conférences, de réunions':
valeurReference1 = 100;
valeurReference2 = 200;
valeurReference3 = 200;
break;
case 'Type L salle de spectacles, de projections ou à usage multiple':
valeurReference1 = 20;
valeurReference2 = 50;
valeurReference3 = 50;
break;
case 'Type M':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 200;
break;
case 'Type N':
valeurReference1 = 100;
valeurReference2 = 200;
valeurReference3 = 200;
break;
case 'Type O':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 100;
break;
case 'Type P':
valeurReference1 = 20;
valeurReference2 = 100;
valeurReference3 = 120;
break;
case 'Type R écoles maternelles, crèches, haltes garderies et jardin d'enfants':
valeurReference1 = 0;
valeurReference2 = 20;
valeurReference3 = 100;
break;
case 'Type R autres établissements':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 200;
break;
case 'Type R MAM':
valeurReference1 = 16;
valeurReference2 = 16;
valeurReference3 = 16;
break;
case 'Type R avec locaux réservé au sommeil':
valeurReference1 = 30;
valeurReference2 = 30;
valeurReference3 = 30;
break;
case 'Type S':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 200;
break;
case 'Type T':
valeurReference1 = 10;
valeurReference2 = 100;
valeurReference3 = 200;
break;
case 'Type U sans hébergement':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 100;
break;
case 'Type U avec hébergement':
valeurReference1 = 20;
valeurReference2 = 20;
valeurReference3 = 20;
break;
case 'Type V':
valeurReference1 = 100;
valeurReference2 = 200;
valeurReference3 = 300;
break;
case 'Type W':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 200;
break;
case 'Type X':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 200;
break;
case 'Type Y':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 200;
break;
case 'Type PA':
valeurReference1 = 300;
valeurReference2 = 300;
valeurReference3 = 300;
break;
case 'Type OA':
valeurReference1 = 20;
valeurReference2 = 20;
valeurReference3 = 20;
break;
case 'Type CTS':
valeurReference1 = 1;
valeurReference2 = 2;
valeurReference3 = 3;
break;
default:
break;
}
}

if(valeurreference1>valeur_1) { if (valeurreference2>Valeur_2) { if(valeurreference3>total.value){ alert("test");
else alert("test2");
</script>

</br></br>
<script language="javascript" type="text/javascript">
function send() {
document.form1.total.value = parseInt(document.form1.valeur_1.value) + parseInt(document.form1.valeur_2.value) + parseInt(document.form1.valeur_3.value);
}
</script>
<form id="form1" name="form1" method="post" action="">
Effectif en sous sol :
<input type="text" name="valeur_1" id="valeur_1" value = "0" onchange="send()"/>
<br /><br />
Effectif au rez-de-chaussée :
<input type="text" name="valeur_3" id="valeur_3" value= "0" onchange="send()"/>
<br /><br />
Effectif en étages :
<input type="text" name="valeur_2" id="valeur_2" value ="0" onchange="send()"/>
<br /><br />
Effectif TOTAL :
<input type="text" name="total" id="total" />
<br /></br>
<body>
<INPUT type="button" value="Calculer le classement" onclick = "changeValeurReference()"</INPUT>
</body>
</form>

Réponse 3 / 4

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
13 août 2015 à 11:29

Plusieurs points à corriger :

1. Attention à la syntaxe HTML (pas de doctype, pas de balise html, balise body mal placée...). Le dernier input de ton formulaire est également mal fermé.

2. Ligne 40 : tu ouvres une <script> alors que tu es déjà dans une balise <script>

3. Attention à la syntaxe javascript : ne pas oublier d'échapper les guillemets dans une chaine de caractères délimitée par des guillemets :

case 'Type L salle d\'auditions, de conférences, de réunions':

4. Ligne 164 : il manque la moitié des accolades après tes conditions if

5. Ligne 166 : tu fermes la balise <script> pour en ouvrir une juste après, autant ne pas la fermer et rester dans la même balise

6. Attention au nommage des variables : valeurreference1 != valeurReference1 (ligne 164)

Deux autres conseils :
- Indente ton code, il sera plus facile à relire et à maintenir
- Utilise la console de développement de ton navigateur (raccourci F12) pour voir les erreurs javascript

Début de correction :

<!doctype html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>test</title>
</head>
<body>
	<label for="url">Choississez le type de votre établissement ? </label></br>
	<SELECT NAME="Type" >
	<option value="">-- Quel est le type de votre établissement ---</option>
	<option value="Type J personnes agées"> Type J personnes agées</option>
	<option value="Type J adultes handicapés"> Type J adultes handicapés</option>
	<option value="Type L salle d'auditions, de conférences, de réunions"> Type L salle d'auditions, de conférences, de réunions</option>
	<option value="Type L salle de spectacles, de projections ou à usage multiple"> Type L salle de spectacles, de projections ou à usage multiple</option>
	<option value="Type M"> Type M </option>
	<option value="Type N "> Type N </option>
	<option value="Type O"> Type O </option>
	<option value="Type P"> Type P </option>
	<option value="Type R écoles maternelles, crèches, haltes garderies et jardin d'enfants"> Type R écoles maternelles, crèches, haltes garderies et jardin d'enfants </option>
	<option value="Type R autres établissements"> Type R autres établissements</option>
	<option value="Type R avec locaux réservé au sommeil"> Type R avec locaux réservé au sommeil</option>
	<option value="Type R MAM"> Type R MAM</option>
	<option value="Type S"> Type S </option>
	<option value="Type T"> Type T </option>
	<option value="Type U sans hébergement"> Type U sans hébergement </option>
	<option value="Type U avec hébergement"> Type U sans hébergement </option>
	<option value="Type V "> Type V </option>
	<option value="Type W"> Type W </option>
	<option value="Type X"> Type X </option>
	<option value="Type Y"> Type Y </option>
	<option value="Type OA "> Type OA </option>
	<option value="Type PA"> Type PA</option>

	</SELECT>

	<script language="javascript" type="text/javascript">
	var valeurReference1 = 0;
	var valeurReference2 = 0;
	var valeurReference3 = 0;

	function changeValeurReference() {
		var typeSelect = document.getElementById('type').value;

		switch(typeSelect) {
			case 'Type J personnes agées':
				valeurReference1 = 25;
				valeurReference2 = 25;
				valeurReference3 = 25;
				break;
			case 'Type J adultes handicapés':
				valeurReference1 = 20;
				valeurReference2 = 20;
				valeurReference3 = 20;
				break;
			case 'Type L salle d\'auditions, de conférences, de réunions':
				valeurReference1 = 100;
				valeurReference2 = 200;
				valeurReference3 = 200;
				break;
			case 'Type L salle de spectacles, de projections ou à usage multiple':
				valeurReference1 = 20;
				valeurReference2 = 50;
				valeurReference3 = 50;
				break;
			case 'Type M':
				valeurReference1 = 100;
				valeurReference2 = 100;
				valeurReference3 = 200;
				break;
			case 'Type N':
				valeurReference1 = 100;
				valeurReference2 = 200;
				valeurReference3 = 200;
				break;
			case 'Type O':
				valeurReference1 = 100;
				valeurReference2 = 100;
				valeurReference3 = 100;
				break;
			case 'Type P':
				valeurReference1 = 20;
				valeurReference2 = 100;
				valeurReference3 = 120;
				break;
			case 'Type R écoles maternelles, crèches, haltes garderies et jardin d\'enfants':
				valeurReference1 = 0;
				valeurReference2 = 20;
				valeurReference3 = 100;
				break;
			case 'Type R autres établissements':
				valeurReference1 = 100;
				valeurReference2 = 100;
				valeurReference3 = 200;
				break;
			case 'Type R MAM':
				valeurReference1 = 16;
				valeurReference2 = 16;
				valeurReference3 = 16;
				break;
			case 'Type R avec locaux réservé au sommeil':
				valeurReference1 = 30;
				valeurReference2 = 30;
				valeurReference3 = 30;
				break;
			case 'Type S':
				valeurReference1 = 100;
				valeurReference2 = 100;
				valeurReference3 = 200;
				break;
			case 'Type T':
				valeurReference1 = 10;
				valeurReference2 = 100;
				valeurReference3 = 200;
				break;
			case 'Type U sans hébergement':
				valeurReference1 = 100;
				valeurReference2 = 100;
				valeurReference3 = 100;
				break;
			case 'Type U avec hébergement':
				valeurReference1 = 20;
				valeurReference2 = 20;
				valeurReference3 = 20;
				break;
			case 'Type V':
				valeurReference1 = 100;
				valeurReference2 = 200;
				valeurReference3 = 300;
				break;
			case 'Type W':
				valeurReference1 = 100;
				valeurReference2 = 100;
				valeurReference3 = 200;
				break;
			case 'Type X':
				valeurReference1 = 100;
				valeurReference2 = 100;
				valeurReference3 = 200;
				break;
			case 'Type Y':
				valeurReference1 = 100;
				valeurReference2 = 100;
				valeurReference3 = 200;
				break;
			case 'Type PA':
				valeurReference1 = 300;
				valeurReference2 = 300;
				valeurReference3 = 300;
				break;
			case 'Type OA':
				valeurReference1 = 20;
				valeurReference2 = 20;
				valeurReference3 = 20;
				break;
			case 'Type CTS':
				valeurReference1 = 1;
				valeurReference2 = 2;
				valeurReference3 = 3;
				break;
			default:
				break;
		}
	}

	if (valeurReference1 > valeur_1) { 
		if (valeurReference2 > Valeur_2) { 
			if(valeurReference3 > total.value){ 
				alert("test");
			} else {
				alert("test2");
			}
		}
	}

	function send() {
		document.form1.total.value = parseInt(document.form1.valeur_1.value) + parseInt(document.form1.valeur_2.value) + parseInt(document.form1.valeur_3.value);
	}
	</script>
	
	<form id="form1" name="form1" method="post" action="">
		Effectif en sous sol :
		<input type="text" name="valeur_1" id="valeur_1" value = "0" onchange="send()"/>
		<br /><br />
		Effectif au rez-de-chaussée :
		<input type="text" name="valeur_3" id="valeur_3" value= "0" onchange="send()"/>
		<br /><br />
		Effectif en étages :
		<input type="text" name="valeur_2" id="valeur_2" value ="0" onchange="send()"/>
		<br /><br />
		Effectif TOTAL :
		<input type="text" name="total" id="total" />
		<br /></br>

		<input type="button" value="Calculer le classement" onclick = "changeValeurReference()" />
	</form>
</body>
</html>

Il reste encore des erreurs javascript dans ce code : "valeur_1 is not defined". En effet tes conditions

if (valeurReference1 > valeur_1)

sont exécuté dès le chargement de la page, or à ce moment les variables valeur_1, valeur_2 et valeur_3 ne sont pas encore définies.

Pour finir, "ça ne marche pas" ne nous permet pas de t'aider à résoudre le problème. Merci de décrire précisément ce qui ne marche pas, c'est à dire la ou les actions effectuées, le ou les résultats attendus et le ou les résultats obtenus.

montail Messages postés 27 Date d'inscription dimanche 24 octobre 2004 Statut Membre Dernière intervention 15 août 2015
13 août 2015 à 11:38

Bonjour,

oups merci e l'aide, je débute en Js et je vois que j'ai pas mal de progrès à faire.

effectivement "ça ne marche pas " est un peu vague, désolé.
j'essaie d'expliquer, avec ce code, lorsque les valeurs sont rentrées, le comparatif devrai se faire et afficher un message alerte, mais le message ne s'affiche pas.

Effectivement c'est surement dû aux valeur qui ne sont pas encore définies.

Je regrde ce que je peux faire et je repasse par ici prochainement ;)

merci

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
13 août 2015 à 11:53

Les comparaisons ne doivent donc pas être effectuées au chargement de la page mais lorsque l'utilisateur saisie une valeur dans un des champs.
Lorsque l'utilisateur saisie une valeur dans un des champs, on exécute la fonction send(), donc les comparaisons devraient être effectuées dans la fonction send().

function send() {
    // on récupère les valeurs saisies
    var valeur_1 = document.getElementById('valeur_1').value;
    var valeur_2 = document.getElementById('valeur_2').value;
    var valeur_3 = document.getElementById('valeur_3').value;

    // on effectue les comparaisons
    // if ...
}

montail Messages postés 27 Date d'inscription dimanche 24 octobre 2004 Statut Membre Dernière intervention 15 août 2015
13 août 2015 à 14:30

Bonjour,

j'essaie d'expliquer mon code :
j'ai créé une liste de choix
j'e défini les valeurs de référence
je fais mes input, onchange le calcul du total se fait

on click buton, je charge la fonction qui, d'après le choix de la liste de choix, va modifier les valeurs de référence.
Ensuite les fonctions IF qui compare les valeurs inputs avec les valeurs de référence et renvoie un message.

Problème aucun message ne s'affiche, je ne comprend pas ou je me trompe.
Même la récupération des valeurs saisie en fonction SEND ne m'arrange pas le problème.

Voici mob code :

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Classement des ERP</title>
</head>
<body>
<label for="url">Choississez le type de votre établissement ? </label></br>
<SELECT NAME="Type" >
<option value="">-- Quel est le type de votre établissement ---</option>
<option value="Type J personnes agées"> Type J personnes agées</option>
<option value="Type J adultes handicapés"> Type J adultes handicapés</option>
<option value="Type L salle d'auditions, de conférences, de réunions"> Type L salle d'auditions, de conférences, de réunions</option>
<option value="Type L salle de spectacles, de projections ou à usage multiple"> Type L salle de spectacles, de projections ou à usage multiple</option>
<option value="Type M"> Type M </option>
<option value="Type N "> Type N </option>
<option value="Type O"> Type O </option>
<option value="Type P"> Type P </option>
<option value="Type R écoles maternelles, crèches, haltes garderies et jardin d'enfants"> Type R écoles maternelles, crèches, haltes garderies et jardin d'enfants </option>
<option value="Type R autres établissements"> Type R autres établissements</option>
<option value="Type R avec locaux réservé au sommeil"> Type R avec locaux réservé au sommeil</option>
<option value="Type R MAM"> Type R MAM</option>
<option value="Type S"> Type S </option>
<option value="Type T"> Type T </option>
<option value="Type U sans hébergement"> Type U sans hébergement </option>
<option value="Type U avec hébergement"> Type U sans hébergement </option>
<option value="Type V "> Type V </option>
<option value="Type W"> Type W </option>
<option value="Type X"> Type X </option>
<option value="Type Y"> Type Y </option>
<option value="Type OA "> Type OA </option>
<option value="Type PA"> Type PA</option>

</SELECT>
</br>
<script language="javascript" type="text/javascript"> // définition des valeurs de référence
var valeurReference1 = 0;
var valeurReference2 = 0;
var valeurReference3 = 0;

function changeValeurReference() { // Fonction appelée on click bouton - modification des valeurs de référence suivant le choix de la liste de choix

var typeSelect = document.getElementById('type').value;
var valeur_1=valeur_1.value
var valeur_2=valeur_2.value
var varleur_3=total.value

switch(typeSelect) {
case 'Type J personnes agées':
valeurReference1 = 25;
valeurReference2 = 25;
valeurReference3 = 25;
break;
case 'Type J adultes handicapés':
valeurReference1 = 20;
valeurReference2 = 20;
valeurReference3 = 20;
break;
case 'Type L salle d\'auditions, de conférences, de réunions':
valeurReference1 = 100;
valeurReference2 = 200;
valeurReference3 = 200;
break;
case 'Type L salle de spectacles, de projections ou à usage multiple':
valeurReference1 = 20;
valeurReference2 = 50;
valeurReference3 = 50;
break;
case 'Type M':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 200;
break;
case 'Type N':
valeurReference1 = 100;
valeurReference2 = 200;
valeurReference3 = 200;
break;
case 'Type O':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 100;
break;
case 'Type P':
valeurReference1 = 20;
valeurReference2 = 100;
valeurReference3 = 120;
break;
case 'Type R écoles maternelles, crèches, haltes garderies et jardin d\'enfants':
valeurReference1 = 0;
valeurReference2 = 20;
valeurReference3 = 100;
break;
case 'Type R autres établissements':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 200;
break;
case 'Type R MAM':
valeurReference1 = 16;
valeurReference2 = 16;
valeurReference3 = 16;
break;
case 'Type R avec locaux réservé au sommeil':
valeurReference1 = 30;
valeurReference2 = 30;
valeurReference3 = 30;
break;
case 'Type S':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 200;
break;
case 'Type T':
valeurReference1 = 10;
valeurReference2 = 100;
valeurReference3 = 200;
break;
case 'Type U sans hébergement':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 100;
break;
case 'Type U avec hébergement':
valeurReference1 = 20;
valeurReference2 = 20;
valeurReference3 = 20;
break;
case 'Type V':
valeurReference1 = 100;
valeurReference2 = 200;
valeurReference3 = 300;
break;
case 'Type W':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 200;
break;
case 'Type X':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 200;
break;
case 'Type Y':
valeurReference1 = 100;
valeurReference2 = 100;
valeurReference3 = 200;
break;
case 'Type PA':
valeurReference1 = 300;
valeurReference2 = 300;
valeurReference3 = 300;
break;
case 'Type OA':
valeurReference1 = 20;
valeurReference2 = 20;
valeurReference3 = 20;
break;
case 'Type CTS':
valeurReference1 = 1;
valeurReference2 = 2;
valeurReference3 = 3;
break;
default:
break;
}
}
// comparaison des valeurs des input et des valeurs de référence

if (valeurReference1 > valeur_1) {
if (valeurReference2 > valeur_2) {
if(valeurReference3 > total.value){
alert("L'établissement est classé en 5ème catégorie");
} else {
if (total.value=<300){
alert("l'établissement est classé en 4ème catégorie");{
if(total.value=<700 && total.value=>301 ){
alert("l'établissement est classé en 3ème catégorie");
if (total.value=<1500 && total.value=>701) {
alert("l'établissement est classé en 2 ème catégorie");
if (total.value=>1500){
alert(l'établissement est classé en 1ère catégorie');
}
}
}
}
}
}
}
}

// modification des valeurs input et total
function send() {
document.form1.total.value = parseInt(document.form1.valeur_1.value) + parseInt(document.form1.valeur_2.value) + parseInt(document.form1.valeur_3.value);
}
</script>

<form id="form1" name="form1" method="post" action="">
</br>
Effectif en sous sol :
<input type="text" name="valeur_1" id="valeur_1" value = "0" onchange="send()"/>
<br /><br />
Effectif au rez-de-chaussée :
<input type="text" name="valeur_3" id="valeur_3" value= "0" onchange="send()"/>
<br /><br />
Effectif en étages :
<input type="text" name="valeur_2" id="valeur_2" value ="0" onchange="send()"/>
<br /><br />
Effectif TOTAL :
<input type="text" name="total" disabled =yes id="total" />

<br /></br>

<input type="button" value="Calculer le classement" onclick = "changeValeurReference()" />
</form>
</body>
</html>

montail Messages postés 27 Date d'inscription dimanche 24 octobre 2004 Statut Membre Dernière intervention 15 août 2015
13 août 2015 à 16:10

ahhh vraiment je ne comprends pas ce qui coince, bon je sais que mon code n'est pas propre, mais grace à l'aide du forum j'apprends beaucoup et je comprends ce que je fais, c'est important.

Mais la je ne comprends pas ce qui se passe

Réponse 4 / 4

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
14 août 2015 à 09:30

Encore quelques petites erreurs de syntaxe javascript, n'hésite pas à regarder la console d'erreur.

Les opérateurs de comparaison => et =< n'existe pas, il faut les remplacer par >= et <=.

Si j'ai bien compris ton besoin (ce qui n'est pas sur), les valeurs de référence doivent être modifiées lors du choix du type d'établissement ? Si oui, il faut exécuter la fonction changeValeurReference() sur l'événement onchange de la liste de type.
Enfin je suppose que les comparaisons et l'affichage du classement sont à exécuter lors du clic sur le bouton Calculer classement, donc on ajoute une fonction pour réagir à cet événement.

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Classement des ERP</title>
</head>
<body>

	<form id="form1" name="form1" method="post" action="">
		<label for="url">Choississez le type de votre établissement ? </label></br>

		<SELECT NAME="type" onchange="changeValeurReference()">
			<option value="">-- Quel est le type de votre établissement ---</option>
			<option value="Type J personnes agées"> Type J personnes agées</option>
			<option value="Type J adultes handicapés"> Type J adultes handicapés</option>
			<option value="Type L salle d'auditions, de conférences, de réunions"> Type L salle d'auditions, de conférences, de réunions</option>
			<option value="Type L salle de spectacles, de projections ou à usage multiple"> Type L salle de spectacles, de projections ou à usage multiple</option>
			<option value="Type M"> Type M </option>
			<option value="Type N "> Type N </option>
			<option value="Type O"> Type O </option>
			<option value="Type P"> Type P </option>
			<option value="Type R écoles maternelles, crèches, haltes garderies et jardin d'enfants"> Type R écoles maternelles, crèches, haltes garderies et jardin d'enfants </option>
			<option value="Type R autres établissements"> Type R autres établissements</option>
			<option value="Type R avec locaux réservé au sommeil"> Type R avec locaux réservé au sommeil</option>
			<option value="Type R MAM"> Type R MAM</option>
			<option value="Type S"> Type S </option>
			<option value="Type T"> Type T </option>
			<option value="Type U sans hébergement"> Type U sans hébergement </option>
			<option value="Type U avec hébergement"> Type U sans hébergement </option>
			<option value="Type V "> Type V </option>
			<option value="Type W"> Type W </option>
			<option value="Type X"> Type X </option>
			<option value="Type Y"> Type Y </option>
			<option value="Type OA "> Type OA </option>
			<option value="Type PA"> Type PA</option>
		</SELECT>
		
		</br>
	
		</br>
		Effectif en sous sol :
		<input type="text" name="valeur_1" id="valeur_1" value = "0" onchange="send()"/>
		<br /><br />
		Effectif au rez-de-chaussée :
		<input type="text" name="valeur_3" id="valeur_3" value= "0" onchange="send()"/>
		<br /><br />
		Effectif en étages :
		<input type="text" name="valeur_2" id="valeur_2" value ="0" onchange="send()"/>
		<br /><br />
		Effectif TOTAL :
		<input type="text" name="total" disabled =yes id="total" />

		<br /></br>

		<input type="button" value="Calculer le classement" onclick="calculerClassement()" />
	</form>
	
	<script language="javascript" type="text/javascript"> // définition des valeurs de référence
	var valeurReference1 = 0;
	var valeurReference2 = 0;
	var valeurReference3 = 0;

	function changeValeurReference() { // Fonction appelée on click bouton - modification des valeurs de référence suivant le choix de la liste de choix
		var typeSelect =  document.form1.type.value;

		switch(typeSelect) {
		case 'Type J personnes agées':
		valeurReference1 = 25;
		valeurReference2 = 25;
		valeurReference3 = 25;
		break;
		case 'Type J adultes handicapés':
		valeurReference1 = 20;
		valeurReference2 = 20;
		valeurReference3 = 20;
		break;
		case 'Type L salle d\'auditions, de conférences, de réunions':
		valeurReference1 = 100;
		valeurReference2 = 200;
		valeurReference3 = 200;
		break;
		case 'Type L salle de spectacles, de projections ou à usage multiple':
		valeurReference1 = 20;
		valeurReference2 = 50;
		valeurReference3 = 50;
		break;
		case 'Type M':
		valeurReference1 = 100;
		valeurReference2 = 100;
		valeurReference3 = 200;
		break;
		case 'Type N':
		valeurReference1 = 100;
		valeurReference2 = 200;
		valeurReference3 = 200;
		break;
		case 'Type O':
		valeurReference1 = 100;
		valeurReference2 = 100;
		valeurReference3 = 100;
		break;
		case 'Type P':
		valeurReference1 = 20;
		valeurReference2 = 100;
		valeurReference3 = 120;
		break;
		case 'Type R écoles maternelles, crèches, haltes garderies et jardin d\'enfants':
		valeurReference1 = 0;
		valeurReference2 = 20;
		valeurReference3 = 100;
		break;
		case 'Type R autres établissements':
		valeurReference1 = 100;
		valeurReference2 = 100;
		valeurReference3 = 200;
		break;
		case 'Type R MAM':
		valeurReference1 = 16;
		valeurReference2 = 16;
		valeurReference3 = 16;
		break;
		case 'Type R avec locaux réservé au sommeil':
		valeurReference1 = 30;
		valeurReference2 = 30;
		valeurReference3 = 30;
		break;
		case 'Type S':
		valeurReference1 = 100;
		valeurReference2 = 100;
		valeurReference3 = 200;
		break;
		case 'Type T':
		valeurReference1 = 10;
		valeurReference2 = 100;
		valeurReference3 = 200;
		break;
		case 'Type U sans hébergement':
		valeurReference1 = 100;
		valeurReference2 = 100;
		valeurReference3 = 100;
		break;
		case 'Type U avec hébergement':
		valeurReference1 = 20;
		valeurReference2 = 20;
		valeurReference3 = 20;
		break;
		case 'Type V':
		valeurReference1 = 100;
		valeurReference2 = 200;
		valeurReference3 = 300;
		break;
		case 'Type W':
		valeurReference1 = 100;
		valeurReference2 = 100;
		valeurReference3 = 200;
		break;
		case 'Type X':
		valeurReference1 = 100;
		valeurReference2 = 100;
		valeurReference3 = 200;
		break;
		case 'Type Y':
		valeurReference1 = 100;
		valeurReference2 = 100;
		valeurReference3 = 200;
		break;
		case 'Type PA':
		valeurReference1 = 300;
		valeurReference2 = 300;
		valeurReference3 = 300;
		break;
		case 'Type OA':
		valeurReference1 = 20;
		valeurReference2 = 20;
		valeurReference3 = 20;
		break;
		case 'Type CTS':
		valeurReference1 = 1;
		valeurReference2 = 2;
		valeurReference3 = 3;
		break;
		default:
		break;
		}
	}

	function calculerClassement() {
		var valeur_1 = document.form1.valeur_1.value;
		var valeur_2 = document.form1.valeur_2.value;
		var valeur_3 = document.form1.valeur_3.value;
		
		// comparaison des valeurs des input et des valeurs de référence
		if (valeurReference1 > valeur_1) {
			if (valeurReference2 > valeur_2) {
				if(valeurReference3 > total.value){
					alert("L'établissement est classé en 5ème catégorie");
				} else {
					if (total.value <= 300) {
						alert("l'établissement est classé en 4ème catégorie");
						
						if (total.value <= 700 && total.value >= 301) {
							alert("l'établissement est classé en 3ème catégorie");
							if (total.value <= 1500 && total.value >= 701) {
								alert("l'établissement est classé en 2 ème catégorie");
								if (total.value >= 1500){
									alert("l'établissement est classé en 1ère catégorie");
								}
							}
						}
					}
				}
			}
		}
	}

	// modification des valeurs input et total
	function send() {
		document.form1.total.value = parseInt(document.form1.valeur_1.value) + parseInt(document.form1.valeur_2.value) + parseInt(document.form1.valeur_3.value);
	}
	</script>
</body>
</html>

J'ai déplacé tout le formulaire au début de la page, ceci n'a aucune incidence à part regrouper les codes html et javascript pour une meilleure organisation.

Bon développement

montail Messages postés 27 Date d'inscription dimanche 24 octobre 2004 Statut Membre Dernière intervention 15 août 2015
14 août 2015 à 15:19

bonjour, et merci beaucoup pour ton aide

excellent, j'adore.

un dernier point avec if .
Avec le code je voudrais faire : si la valeurReference1 > valeur_1 et si valeurReference2>valeur_2 et si valeurReference3<valeur_3 afficher un message autrement
verifier que la valeur_3 et <300 et afficher un message autrement vérifier que la valeur_3 et entre 300 et 700 et afficher un message autrement verifier que la valeur_3 et entre 701 et 1500 et afficher un message autrement verifier que valeur_3 est au dessus de 1500 et afficher un message.

pour cela j'ai adapté un peu le code que pitet m'a préparer mais toutes les vérifs ne se font pas.

function calculerClassement() {

var valeur_1 = document.form1.valeur_1.value;
var valeur_2 = document.form1.valeur_2.value;
var valeur_3 = document.form1.total.value;

// comparaison des valeurs des input et des valeurs de référence
if (valeurReference1 > valeur_1) {
if (valeurReference2 > valeur_2) {
if(valeurReference3 > total.value){
alert("L'établissement est classé en 5ème catégorie");
} else {
if (total.value <= 300) {
alert("l'établissement est classé en 4ème catégorie");
} else {
if (total.value <= 700 && total.value >= 301) {
alert("l'établissement est classé en 3ème catégorie");
} else {
if (total.value <= 1500 && total.value >= 701) {
alert("l'établissement est classé en 2 ème catégorie");
} else {
if (total.value >= 1500){
alert("l'établissement est classé en 1ère catégorie");
}
}
}
}
}
}
}
}
merci

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
14 août 2015 à 15:34

Dans ton message ci-dessus, tu dis vouloir faire des comparaisons avec la variable valeur_3 mais dans ton code tu utilises total.value. Je ne sais donc pas quel est le bon calcul.

En découpant ton texte on a donc 5 conditions :

if (valeurReference1 > valeur_1 && valeurReference2 > valeur_2 && valeurReference3 < valeur_3) {
	// si la valeurReference1 > valeur_1 et si valeurReference2>valeur_2 et si valeurReference3<valeur_3 afficher un message 
	alert('afficher un message');
} else {
	if (valeur_3 < 300) {
		// autrement verifier que la valeur_3 et <300 et afficher un message 
		alert('afficher un message');
	} else if (valeur_3 >= 300 && valeur_3 <= 700) {
		// autrement vérifier que la valeur_3 et entre 300 et 700 et afficher un message
		alert('afficher un message');
	} else if (valeur_3 >= 701 && valeur_3 <= 1500) {
		// autrement verifier que la valeur_3 et entre 701 et 1500 et afficher un message
		alert('afficher un message');
	} else if (valeur_3 > 1500) {
		// autrement verifier que valeur_3 est au dessus de 1500 et afficher un message. 
		alert('afficher un message');
	} 
}

montail Messages postés 27 Date d'inscription dimanche 24 octobre 2004 Statut Membre Dernière intervention 15 août 2015 > Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022
14 août 2015 à 15:46

Re

il me semble que ça fonctionne, j'étudie et j'applique.

merci et chapeau

montail
14 août 2015 à 19:27

excellent, un ENORME merci

encore quelques réglage pour aligner mes inputs

Discussions similaires

"Aucune application permettant d'ouvrir cette URL"

Rajout de lien sur plusieurs pages

lien copié

input signal out of range

liste de noms par ordre alphabétique

Discussions similaires

Newsletters