Discussion :

[sushi_]

Bonjour,

Je suis en train de créer un site dans lequel j'ai un questionnaire assez long avec a chaque ligne une affirmation et en face, 5 checkbox. (coresspondant à une note de 0 à 5)

Les affirmations sont regroupées en bloc de 3, et chaque checkbox a un nom comme ca : Bloc1Ligne3Colonne2
Bloc coresspond au numéro du Bloc, Ligne au numéro de la ligne dans le bloc, et Colonne à la position de la chackbox sur la ligne.

Voila le code d'un bloc :

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
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
		<form name="Questionnaire" id="Questionnaire" method="post" action="" onsubmit="return validateForm(this)">
 
			<div id="titreForm"> Questionnaire</div>
 
			<div id="corpForm">
				<fieldset id="Bloc">
 
					<p>
						<label for="Bloc1Ligne1">1) Affirmation 1</label>
 
						<input type="checkbox"  id="Bloc1Ligne1Colonne1" name="Bloc1Ligne1Colonne1" onclick="changer (1,1,1)"/>
						<input type="checkbox"  id="Bloc1Ligne1Colonne2" name="Bloc1Ligne1Colonne2" onclick="changer (1,1,2)"/>
						<input type="checkbox"  id="Bloc1Ligne1Colonne3" name="Bloc1Ligne1Colonne3" onclick="changer (1,1,3)"/>
						<input type="checkbox"  id="Bloc1Ligne1Colonne4" name="Bloc1Ligne1Colonne4" onclick="changer (1,1,4)"/>
						<input type="checkbox"  id="Bloc1Ligne1Colonne5" name="Bloc1Ligne1Colonne5" onclick="changer (1,1,5)"/>
					</p>
 
					<p>
						<label for="Bloc1Ligne2">2) Affirmation 2</label>
 
						<input type="checkbox"  id="Bloc1Ligne2Colonne1" name="Bloc1Ligne2Colonne1" onclick="changer (1,2,1)"/>
						<input type="checkbox"  id="Bloc1Ligne2Colonne2" name="Bloc1Ligne2Colonne2" onclick="changer (1,2,2)"/>
						<input type="checkbox"  id="Bloc1Ligne2Colonne3" name="Bloc1Ligne2Colonne3" onclick="changer (1,2,3)"/>
						<input type="checkbox"  id="Bloc1Ligne2Colonne4" name="Bloc1Ligne2Colonne4" onclick="changer (1,2,4)"/>
						<input type="checkbox"  id="Bloc1Ligne2Colonne5" name="Bloc1Ligne2Colonne5" onclick="changer (1,2,5)"/>
					</p>
 
					<p>
						<label for="Bloc1Ligne3">3) Affirmation 3</label>
 
						<input type="checkbox"  id="Bloc1Ligne3Colonne1" name="Bloc1Ligne3Colonne1" onclick="changer (1,3,1)"/>
						<input type="checkbox"  id="Bloc1Ligne3Colonne2" name="Bloc1Ligne3Colonne2" onclick="changer (1,3,2)"/>
						<input type="checkbox"  id="Bloc1Ligne3Colonne3" name="Bloc1Ligne3Colonne3" onclick="changer (1,3,3)"/>
						<input type="checkbox"  id="Bloc1Ligne3Colonne4" name="Bloc1Ligne3Colonne4" onclick="changer (1,3,4)"/>
						<input type="checkbox"  id="Bloc1Ligne3Colonne5" name="Bloc1Ligne3Colonne5" onclick="changer (1,3,5)"/>
					</p>
 
				</fieldset>
			</div>
 
			<div id="piedForm">
 
				<input type="submit" name="valid" id="valid" value="Valider" title="Cliquez sur ce bouton valider vos r&eacute;ponses" />
 
			</div>

La fonction "changer(arg1,arg2,arg3)" sert à faire respecter une règle dans les réponses en désactivant certaines checkbox : il ne doit y avoir une seule réponse par ligne et pas deux réponses dans la meme colonne au sein d'un meme bloc.

Pour cette raison, je ne peux malheureusement pas utiliser de bouton radio...


Et voila mon problème : Je n'arrive pas à contrôler que l'utilisateur a bien répondu à toutes les affirmations (donc qu'il y a bien une case cochée par ligne)

J'ai créé une fontion JavaScript que j'appelle au moment de la validation mais elle ne marche pas alors que normalement elle est correcte, du moins au niveau algorithmique.

Voila la fonction :

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
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
function validateForm(form)
{
	var Bloc = 1 ;
	var Ligne = 1 ;
	var Colonne = 1 ;
 
	var test = true ;
 
	var IDCase ;
 
	while ( Bloc <= 28 && test == true)
	{
		while ( Ligne <= 3 && test == true)
		{
				IDCase1 = "Bloc"+Bloc+"Ligne"+Ligne+"Colonne1" ;
				IDCase2 = "Bloc"+Bloc+"Ligne"+Ligne+"Colonne2" ;
				IDCase3 = "Bloc"+Bloc+"Ligne"+Ligne+"Colonne3" ;
				IDCase4 = "Bloc"+Bloc+"Ligne"+Ligne+"Colonne4" ;
				IDCase5 = "Bloc"+Bloc+"Ligne"+Ligne+"Colonne5" ;
 
				if ( ! this.form.element[IDCase1].checked && ! this.form.[IDCase2].checked && ! this.form.[IDCase3].checked && ! this.form.[IDCase4].checked && ! this.form.[IDCase5].checked && )
				{
					test = false ;
				}
 
			Ligne++ ;
		}
		Bloc++ ;
	}
 
	if ( test )
	{
		return true ;
	}
	else
	{
		return false ;
	}
 
}

Voila mon problème !

Je ne suis pas un pro du JavaScript, et je ne suis pas sur de la syntaxe pour vérifier qu'une case est cochée et encore moins que l'on puisse utiliser une variable de type chaine au milieu de cette fonction...

Merci d'avance pour votre aide !!

[E.Bzz]

Bonjour,

Code :

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

document.forms['Questionnaire'].elements[IDCase1].checked

Mais il serait encore préférable d'utiliser

Code :

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

document.getElementById(IDCase1).checked

A+

[sushi_]

Merci de cette réponse, mais ca ne marche toujours pas...

Ma fonction ressemble à ça :

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
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
function validateForm(form)
{
 
	var Bloc = 1 ;
	var Ligne = 1 ;
	var Colonne = 1 ;
 
	var test = true ;
 
	var IDCase ;
 
	while ( Bloc <= 28 && test == true)
	{
		while ( Ligne <= 3 && test == true)
		{
				IDCase1 = "Bloc"+Bloc+"Ligne"+Ligne+"Colonne1" ;
				IDCase2 = "Bloc"+Bloc+"Ligne"+Ligne+"Colonne2" ;
				IDCase3 = "Bloc"+Bloc+"Ligne"+Ligne+"Colonne3" ;
				IDCase4 = "Bloc"+Bloc+"Ligne"+Ligne+"Colonne4" ;
				IDCase5 = "Bloc"+Bloc+"Ligne"+Ligne+"Colonne5" ;
 
				if (	document.getElementById(IDCase1).checked ||
						document.getElementById(IDCase2).checked ||
						document.getElementById(IDCase3).checked ||
						document.getElementById(IDCase4).checked ||
						document.getElementById(IDCase5).checked
					)
				{
					test = false ;
			        alert("Veuillez renseigner les champs obligatoires.");
				}
 
			Ligne++ ;
		}
		Bloc++ ;
	}
 
	if ( test )
	{
		return true ;
	}
	else
	{
		return false ;
	}
 
}

Et l'appel de la fonction :

Code :

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

<form name="RadarTalents" id="RadarTalents" method="post" action="" onsubmit="return validateForm(this)">

[E.Bzz]

Merci de cette réponse, mais ca ne marche toujours pas...

C'est à dire ?
Erreur(s) ?
Pas le fonctionnement attendu ?
Rien ?

De plus, je pense que tu as fait ta condition à l'envers : il doit t'afficher le message que quans une des cases est cochée. Essaye plutôt

Code :

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

if (!(document.getElementById(IDCase1).checked ||document.getElementById(IDCase2).checked ||document.getElementById(IDCase3).checked ||document.getElementById(IDCase4).checked ||document.getElementById(IDCase5).checked))

A+

[sushi_]

OUPS !!

L'erreur venait en effet de ma condition...

Maintenant le script marche à peu près...
Il faut juste que je le debbug car il ne test que le premier bloc, mais la vérification des checkbox marche !

Merci beacoup pour votre aide !