bouton radio couleur

Version imprimable

Voir 40 message(s) de cette discussion en une page

11/06/2010, 09h46
E.Bzz

Citation:

Envoyé par fado59

sauf que un seule réponse se met en orange si je passe à une autre question, elle se remet en noir

Tu veux que chaque question cochée reste tout le temps en orange ?

A+
11/06/2010, 09h54
fado59

oui,

Une idée ?

Comment faire pour qu'on mémorise la couleur à chaque case ?
11/06/2010, 10h11
E.Bzz

Citation:

Envoyé par fado59

Comment faire pour qu'on mémorise la couleur à chaque case ?

Ben il ne s'agit pas de la mémoriser, mais de ne pas la réinitialiser à chaque clic.

Du coup c'est beaucoup plus simple (plus besoin de fonction) :aie:

Code:

onclick="this.parentNode.className='orange';"

:calim2:

A+
11/06/2010, 10h16
fado59

Citation:

Envoyé par E.Bzz

Ben il ne s'agit pas de la mémoriser, mais de ne pas la réinitialiser à chaque clic.

Du coup c'est beaucoup plus simple (plus besoin de fonction) :aie:

Code:

onclick="this.parentNode.className='orange';"

:calim2:

A+

euh j'ai rajouter ce que tu m'a dis sa ne fonctionne pas, pourrais tu me donner le code complet ? c'est celui que je t'ai envoyé ou celui que tu as édité ?
11/06/2010, 10h17
E.Bzz

Citation:

Envoyé par fado59

c'est celui que je t'ai envoyé ou celui que tu as édité ?

C'est un onclick modifié du dernier code que tu as posté ...

A+
11/06/2010, 10h17
E.Bzz

Citation:

Envoyé par fado59

j'ai rajouter ce que tu m'a dis

Ce n'est pas à ajouter mais à remplacer ...
11/06/2010, 10h23
fado59

En fait ça fonctionne mais le soucis c'est que si la personne s'est trompé de réponse et qu'elle recoche une autre l'ancienne restera orange alors qu'elle n'est plus coché.

Car si je veux la je clique sur tout et tout deviens orange.

Comment faire stp?
11/06/2010, 10h27
E.Bzz

Citation:

Envoyé par fado59

Comment faire stp?

Tu testes le className et s'il est déjà "orange" tu l'enlèves :no:

Tu essayes, des fois, de faire par toi-même ? :mrgreen:

A+
11/06/2010, 10h29
fado59

ba écoutez j'ai cherché toute la journée hier,

le orange n'est apparu que ce matin même.

C'est si compliqué que sa à faire ?
11/06/2010, 10h30
E.Bzz

Et puis ça serait pas mal de poser correctement la question et toute la question dès le début ...

Parce que "Ah oui mais je voudrais aussi que ..." au 48eme post de la discussion c'est un peu tard non ?
11/06/2010, 10h32
E.Bzz

Citation:

Envoyé par fado59

C'est si compliqué que sa à faire ?

Non à condition d'essayer ...

A+ et bon courage ;)
11/06/2010, 10h35
fado59

ok ok donc un if à faire.

Je vais faire une recherche et tester. Je dois chercher quoi tester un classname?

Merci de ton aide au fait

C'est un bon début sa ?

if(this.parentNode.className == 'orange') {
J'enleve la couleur orange. ( je peux repasser la couleur en noir ? )
}

EDIT : désolé mais c'était assez clair pour moi, peut être ai-je mal formulé

Le début est bon? Merci de ton aide :ccool:
11/06/2010, 11h08
fado59
Code:

1 2 3 4 5 if(this.parentNode.className == 'orange') { this.parentNode.className = 'noir' ; }
C'est possible ça ? :?
Par ce que j'ai essayé sa, ça ne fonctionne pas. erreur de syntaxe
11/06/2010, 11h11
vermine
Code:

1 2 3 4 5 if(this.parentNode.className == 'orange') { this.parentNode.className = '' ; }
Le vide car vous n'avez pas de class définie au nom de "noir".
11/06/2010, 11h18
E.Bzz

Citation:

Envoyé par fado59

erreur de syntaxe

C'est plutôt que ce code ne se trouve pas au bon endroit ;)

Tu ne dois pas avoir de this dans la fonction :fleche: passe this en paramètre de la fonction et utilise ce paramètre à la place de this dans la fonction ...

A+
11/06/2010, 11h19
fado59

ok ba j'avais créer une classe noir en fait mais ça ne fonctionnai pas.

On va bien finir par y arriver :roll:

Tu m'en demande beaucoup là lol je débute. Il faut que je passe this en paramètre donc.. Je vais essayer de voir sa sur le net car je ne sais pas du tout comment faire
11/06/2010, 11h22
vermine

Je ne sais pas si vous avez vu la réponse d'E.Bzz car vous avez posté en même temps:

Citation:

Envoyé par E.Bzz

C'est plutôt que ce code ne se trouve pas au bon endroit ;)

Tu ne dois pas avoir de this dans la fonction :fleche: passe this en paramètre de la fonction et utilise ce paramètre à la place de this dans la fonction ...

A+
11/06/2010, 11h25
fado59

Sisi j'ai vu,

Je suis en train de chercher sur le net par ce que je ne sais pas du tout comment faire pour ce paramètre.

Si vous pouvez me mettre sur la voix. J'ai trouvé quasiment tout seul pour le if, excepté vide au lieu de noir.

Mais j'avoue que la je ne sais pas du tout comment faire.

EDIT : De quelle fonction parle tu? elle n'existe plus la basculeOrange, ça fonctionne très bien sans
11/06/2010, 11h31
E.Bzz

http://jacques-guizol.developpez.com/javascript/
:fleche: http://jacques-guizol.developpez.com...tions.php#IV.5
11/06/2010, 11h33
fado59
oui mais il n'y a plus de fonction?
Je créé une fonction et je met le if dedans ?
Du style :
Code:

1 2 3 4 5 6 7 function bascule(this) { if(this.parentNode.className == 'orange') { this.parentNode.className = '' ; } } (
Est-ce que c'est sa que tu sous entend? Si tu peux m'aider car je bloque dans mon code là.
11/06/2010, 11h38
andry.aime

Citation:

oui mais il n'y a plus de fonction?

As-tu regardé le deuxième lien que E.Bzz t'as donnée? :scarymov:
11/06/2010, 11h46
fado59
oui
Code:

1 2 3 4 function <ident> ([<par1> [,<par2> [..., <parp>]...]){ <corps de function> }
Qu'est ce qui ne vas pas les crochets? On doit les mettre si il n'y a qu'un paramètre ? Désolé ça vous semble facile très certainement

Le reste est bon? Désolé de vous faire perdre votre temps, c'est juste que ça m'énerve de ne pas trouver alors qu'il n'y a qu'une ligne à faire.

Qu'est ce qui ne va pas dans mon code svp? merci d'avance
Code:

1 2 3 4 5 6 function bascule(this) { if(this.parentNode.className == 'orange') { this.parentNode.className = '' ; } } (

Code:

1
2
3
4
5
function bascule(obj) {
if(obj.parentNode.className == 'orange') {
obj.parentNode.className = '' ;
}
}

Code:

onclick="bascule(this)"

11/06/2010, 12h00
E.Bzz
Citation:

Envoyé par fado59

Qu'est ce qui ne va pas dans mon code svp?
Code:

1 2 3 4 5 function bascule(param) { if(param.parentNode.className == 'orange') { param.parentNode.className = '' ; } }
Relis ce que je t'avais dit à ce sujet, ça devrait éclairer les choses.

Et lis la totalité du 1° lien que je t'ai donné : ça te fera gagner énormément de temps les prochaines fois ;)

A+
11/06/2010, 12h13
fado59

ok merci je vais manger la.

Donc si je met le code que tu m'a donner sa marche?

Je test sa juste après.
11/06/2010, 12h18
E.Bzz

Citation:

Envoyé par fado59

Je dois faire appel à la fonction aussi?

Non, ça c'est juste pour la déco parce que la discussion n'est pas assez compliquée comme ça :roll:

PS : en plus Andry t'a déjà tout dit
11/06/2010, 12h24
fado59

lol nan je dis sa par ce que c'est bizarre qu'avec ton si beau code que tu m'a éditer ça ne fonctionne pas le fait de mettre en orange ce qu'on coche.
11/06/2010, 12h27
E.Bzz

Citation:

Envoyé par fado59

lol nan je dis sa par ce que c'est bizarre qu'avec ton si beau code que tu m'a éditer ça ne fonctionne pas le fait de mettre en orange ce qu'on coche.

Oulaaa !

Évite ce genre de remarques si tu veux être encore pris au sérieux :no:

D'une part c'était ton code et non le mien, et d'autre part on est pas à la télé : c'est parce que c'est bô que c'est bien :aie:
11/06/2010, 12h29
andry.aime

Tu n'as qu'à ajouter un "else" ou parcourir tous les boutons et décolorer ce qui ne sont pas coché.

Une lecture de tutoriel ne te fera pas de mal. :merci:
11/06/2010, 12h32
fado59

a non ne t'inquiète pas E.bzz ce n'était pas méchant du tout. Désolé ^^
Je vais manger je test sa juste après. Bonne appétit
11/06/2010, 12h35
E.Bzz

Citation:

Envoyé par andry.aime

Tu n'as qu'à ajouter un "else" ou parcourir tous les boutons et décolorer ce qui ne sont pas coché.

C'était la solution donnée au début, mais on s'est aperçu au 45° post que non :aie:

En compilant l'ensemble de la discussion on s'aperçoit qu'il faut garder coché ce qui a été coché mais il faut pouvoir annuler en cas d'erreur ... :zen:

A+
11/06/2010, 12h36
E.Bzz

Citation:

Envoyé par fado59

a non ne t'inquiète pas E.bzz ce n'était pas méchant du tout. Désolé ^^

Je ne considérais pas ça comme "méchant".

Je disais plutôt ça pour toi ;)

A+
11/06/2010, 12h44
fado59
ok ok je viens de tester je ne comprend pas si je n'ajoute pas la fonction si je clique sur un bouton radio il devient orange si je reclique sur un autre bouton il devient orange également tout en gardant le 1er orange.

Avec la fonction, j'ai beau cliqué partout, pas d'orange. le texte reste en noir.

J'ai bien mis le onclick pourtant
Code:

1 2 print "<input type='radio' onclick='bascule(this)' name=\"$i\" checked='checked' value=\"$j\" /> $question<br /> "; // Bouton radio, dernier coché par défaut
et la fonction entre les balises script dans le head
Code:

1 2 3 4 5 6 7 8 9 10 <head> <script type="text/javascript"> function bascule(obj) { if(obj.parentNode.className == 'orange') { obj.parentNode.className = '' ; } } </script> </head>
J'ai vraiment pas de chance, de quoi se mettre une balle :aie:
11/06/2010, 12h46
andry.aime

Citation:

Envoyé par E.Bzz

C'était la solution donnée au début, mais on s'est aperçu au 45° post que non

@fado59 soit tu fait un peu d'effort, soit on va tourner en rond, soit je suis à coté de la plaque :koi:
11/06/2010, 12h52
fado59

en fait voici un exemple :

question 1 : si je coche une réponse elle devient orange, si j'en coche une autre elle devient orange et efface la précédente
question 2 : si je coche une réponse elle devient orange, et la soucis, le orange de la question 1 s'efface.

Donc en gros à la question 10 j'aurais qu'une réponse orange (la 10) si je fais les questions dans l'ordre.

Je ne sais pas si vous comprenez le soucis.

Sa doit être une petite connerie mais quoi..:cry:

En gros au final, il ne doit y avoir que 10 réponses en orange 1 par questions.

Casse tête casse tête?

C'est moi qui est mal copié le code ? Je ne vois pas le soucis dans mon code là

J'ai refais la fonction, c'est la même chose.

Merci d'avance pour votre aide
11/06/2010, 14h41
fado59

c'est bon j'ai reussi à résoudre mon problème. Il ne me reste plus qu'à cocher non pas le dernier mais le premier bouton par défaut. c'est facile mais avec mon code je n'ai qu'un bouton radio (une boucle) donc je vais voir sa.

Merci de votre aide

EDIT : Comment faire pour checked la première solution de chaque question par défaut? car moi mon code c'est une boucle il n'y a qu'un seul radio.

Merci de votre aide
12/06/2010, 21h29
fado59

Comment faire pour cocher le bouton radio 1 de chaque question sachant que dans mon code je n'ai qu'un radio (dans une boucle)

Merci d'avance pour votre aide, j'ai tenté d'essayer, je n'ai pas réussie

Dans la boucle de création:

Code:

1
2
3
4
5
6
 
 for ($j=1; $j<count($quizz[$i])-2; $j++) {
        $question=$quizz[$i][$j];
        if($j == 1) { $checked = "checked"} else { $checked = "" };
        print "<input type='radio' name=\"$i\" checked=\"$checked\" onclick='basculeOrange(this)'  value=\"$j\" /> $question<br /> "; // Bouton radio, dernier coché par défaut
      }

merci mais apparement ça ne fonctionne pas. le premier bouton n'est pas coché par défaut.

Le code :

Code:

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
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
 
<html>
<head>
<script>
function basculeOrange(elem) {
	var liste = document.getElementsByTagName('input');
	for (var i = 0; i < liste.length; i++) {
		if (liste[i].type==="radio"){
			if(liste[i].checked){
				liste[i].nextSibling.className="orange";
			}else{
				liste[i].nextSibling.className="";
			}
		}
	}
}
 
</script>
</head>
<body>
<?php
 
  error_reporting(E_ALL ^ E_NOTICE); // pour éviter certaines erreurs à l'affichage
 
  if (!isset($_POST['result'])) {
    print "<input onclick='history.go(-1)'  type='image' name='image' value='Retour' src='image/boutonretour.gif'/>"; // Bouton Retour
    print '<center><FONT face="French Script MT" size="50" >Initiation : Info De Base</FONT></center><br>'; // Titre du haut de la page
	 print '<center><FONT face="French Script MT" size="5" ><b>Avant de commencer le Quiz, merci de remplir les champs Nom et Prénom</b></FONT></center><br>'; // Titre du haut de la page
	 	 	  print '<center><FONT face="French Script MT" size="5" ><b>Vérifiez bien que vous avez répondu à toutes les questions puis valider</b></FONT></center><br>'; // Titre du haut de la page
		 print '<center><FONT face="French Script MT" size="5" ><b>Attention : Toutes les questions ont une réponse cochée par défaut.</b></FONT></center><br>'; // Titre du haut de la page
		 	 print '<center><FONT face="French Script MT" size="5" ><b>Ce nest pas obligatoirement la bonne réponse.</b></FONT></center><br>'; // Titre du haut de la page
    		 	 print '<center><FONT face="French Script MT" size="5" ><b>1 seule réponse par question est possible.</b></FONT></center><br>'; // Titre du haut de la page
 
	print '<center><FONT face="French Script MT" size="5" ><b>Bonne Chance.</b></FONT></center><br>'; // Titre du haut de la page
	print "<form id=\"form1\" action=\"{$_SERVER['PHP_SELF']}\" method='post'>";
    print '<b> Votre Nom :</b>   <input type=text name="nom">'; // Champ Nom
    print '<b> Votre Prénom :</b> <input type=text name="prenom"><br><br>'; // Champ Prénom
 
    for ($i=0; $i<count($quizz); $i++) {
      print '<blockquote><span class="orange">';
      print $quizz[$i][0];
      print '</span><br /><br />';
 
      for ($j=1; $j<count($quizz[$i])-2; $j++) {
        $question=$quizz[$i][$j];
        if($j == 1) { 
		 $checked = "checked" ;
		 } else { 
		 $checked = "" ;
		 }
        print "<input type='radio' name=\"$i\" checked=\"$checked\" onclick='basculeOrange(this)'  value=\"$j\" /> $question<br /> "; // Bouton radio, dernier coché par défaut
      }
 
      print "</blockquote>";
    }
 
 
    print "<input type='hidden' name='result' value='voir' /><br />\n<center>";
    print "<input  type='image' src=image/boutonvalider.gif  value='VALIDER' />"; // Bouton Valider
 
 
  }else {
      $nom = $_POST['nom']; // On récupère le nom de la personne
    $prenom = $_POST['prenom']; // On récupère le prénom de la personne
  if(($nom!="") && ($prenom!="")) {
 
    print '<center><FONT face="French Script MT" size="50" >Initiation Info De Base : Correction</FONT></center><br>'; // Titre de haut de la page Correction
    $points=0;
    for($i=0; $i<count($quizz); $i++ ) { 
      $mareponse = trim($_POST[$i]);
      print  '<blockquote><span class="orange">';
      print $quizz[$i][0]."</span><br /><br />";
      $numero_bonne=$quizz[$i][count($quizz[$i])-2]; // avant dernière valeur du tableau
      $bonnereponse=$quizz[$i][$numero_bonne]; // Bonne réponse
      if ($mareponse==$numero_bonne) {
        print "<b><u>Réponse</u></b> : Vous avez répondu <b><i>".$bonnereponse."</i></b> et vous avez raison."; // Message si la réponse est correct
        $nombrepoints++;
     }else {
       print "<b><u>Réponse</u></b> :  Vous avez répondu <b>".$quizz[$i][$mareponse]."</b> mais la bonne réponse est <b>".$bonnereponse."</b>  " ; // Message si la réponse est incorrect
 
     }                
     $commentaire=$quizz[$i][count($quizz[$i])-1]; // dernière valeur du tableau
     print "<br />".$commentaire."<br />";      
     print "</blockquote>";
    }
 
    if($nombrepoints==count($quizz)) {
      print"<h1 align='center'>Félicitations Toutes vos réponses sont correctes!</h1>"; // Message si vous avez répondu correctement à toute les questions
 
    }else {
      print "<br /><h1 align='center'>Vous avez la note de $nombrepoints sur ".count($quizz); // Message si il y a minimum 1 erreur
 
    }
 
 
	// envoi du mail
     $headers ='From: "cyber quizz"<adresse@fai.fr>'."\n";
     $headers .='Reply-To: adresse_de_reponse@fai.fr'."\n";
     $headers .='Content-Type: text/plain; charset="iso-8859-1"'."\n";
     $headers .='Content-Transfer-Encoding: 8bit';
     $mail = mail('thomas.pomart@sfr.fr', 'note du quizz [Info De Base]', "$nom  $prenom  a obtenu la note de $nombrepoints sur 10", $headers); // contenu du mail
 
    }else { 
	if(($nom=='')&&($prenom=='')) {
	echo"<script LANGUAGE='JavaScript'>alert('Veuillez remplir les champs Nom et Prenom ');</SCRIPT>";
/* Redirection vers la page precedente  */	
echo"<script LANGUAGE='JavaScript'>window.location='http://127.0.0.1/Utilisateur_Quiz_Des_Initiations/infodebase.php';</SCRIPT>";	
}
 
	if($nom == '') {
echo"<script LANGUAGE='JavaScript'>alert('Veuillez remplir le champ Nom');</SCRIPT>";
/* Redirection vers la page precedente  */	
echo"<script LANGUAGE='JavaScript'>window.location='http://127.0.0.1/Utilisateur_Quiz_Des_Initiations/infodebase.php';</SCRIPT>";		
 
}
if($prenom == '') {
 
echo"<script LANGUAGE='JavaScript'>alert('Veuillez remplir le champ Prenom');</SCRIPT>";
echo"<script LANGUAGE='JavaScript'>window.location='http://127.0.0.1/Utilisateur_Quiz_Des_Initiations/infodebase.php';</SCRIPT>";	
}
 
	}
	}
?>
</body>

Il doit exister une autre écriture, mais en PhP je ne sais pas comment elle s'écrit donc en attendant:

Code:

1
2
3
4
5
6
7
8
9
10
 
      for ($j=1; $j<count($quizz[$i])-2; $j++) {
        $question=$quizz[$i][$j];
        if($j == 1) { 
             print "<input type='radio' name=\"$i\" checked=\"$checked\" onclick='basculeOrange(this)'  value=\"$j\" /> $question<br /> "; // Bouton radio, premier coché par défaut
		 } else { 
             print "<input type='radio' name=\"$i\" onclick='basculeOrange(this)'  value=\"$j\" /> $question<br /> ";
		 }
 
      }

Voir 40 message(s) de cette discussion en une page