Discussion :

[gtraxx]

Bonjour à tous, je travail en ce moment sur un big formulaire qui me demande beaucoup de travail.
Celui-ci est pratiquement terminé mais il lui manque quelque chose, une validation des boutons radio.
Je souhaite empecher que mon bouton disabled ne sois accessible si les boutons radio appartenant a une certaine CLASS ne sois tous cochés .
Voici mon html en partie :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
<div class="ParentsQuest_8">
        <label>
         Voulez-vous créer une campagne?
        </label>
        <span price="500">
            <input type="radio" name="LinksCampagn" value="1" class="quantity" />
            Oui
            <input type="radio" name="LinksCampagn" value="0" class="quantity" />
            Non
 
           <span class="total"></span>
        </span>
      </div>

Ceci n'est qu'une infime partie du formulaire, en faites toutes les div contenant une class ParentsQuest_ doivent être vérifier donc s'il ne sont pas tous coché renvoi une alert et bloque le bouton.

Voici ce que j'ai essayer de faire :

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
jQuery('#calc').click(function(){
 
			var string = "";
 
			if (jQuery('div.ParentsQuest_8 input[@type=radio][@name=Url]', !this.checked)) {
				string = this.name + ": " + this.checked + "\n";
				alert(string);
			}else {
				var sendForms = jQuery('#process #sendForms');
				sendForms.removeAttr('disabled', 'disabled');
				sendForms.css({
					backgroundColor: 'white',
					color: 'orange',
					border: '1px solid grey'
				});
			}
		});

Voici le html du fameux bouton

Code :

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

1
2
3
4
<div id="process">
	      <input type="button" id="calc" value="Recalcul" />
	      <input type="submit" id="sendForms" value="Resultat" disabled="disabled" />
      </div>

Il me renvoi chaque fois mon alert même si je coche une des propositions , je ne comprend pas pourquoi
j'ai 9 Class de ce type à verifier

[le_chomeur]

normal => !this.checked
donc il rentrera au moins une fois dans ta boucle si l'une de tes checkbox n'est pas sélectionnée

[gtraxx]

je viens d'essayer ceci :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
if (jQuery('div.ParentsQuest_4 input[@type=radio]', this).checked == false) {
				string = this.name + ": non coché" + "\n";
				alert(string);
				return false;
			}else {
				var sendForms = jQuery('#process #sendForms');
				sendForms.removeAttr('disabled', 'disabled');
				sendForms.css({
					backgroundColor: 'white',
					color: 'orange',
					border: '1px solid grey'
				});
				return true;
			}

Mais pareille sa ne fonctionne pas il affiche le bouton disabled et ne renvoi pas le message d'erreur pourtant je ne l'ai pas coché

[Bovino]

Code :

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

(jQuery('div.ParentsQuest_4 input[@type=radio]', this)

le this se réfère au bouton sur lequel tu as cliqué, et dans ce bouton, tu recherches les input de type radio... comme il n'y en a pas, le résultat est false, donc ton test revient à

Code :

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

if(false==false)

qui est toujours vrai !
Donc

il affiche le bouton disabled et ne renvoi pas le message d'erreur pourtant je ne l'ai pas coché

[gtraxx]

oui juste mais alors pk ceci ne fonctionne pas:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
if (jQuery('div.ParentsQuest_4 :radio.quantity').checked == !this.checked) {
					string = this.name + ": non coché" + "\n";
					alert(string);
				return false;
			}else {
				var sendForms = jQuery('#process #sendForms');
					sendForms.removeAttr('disabled', 'disabled');
					sendForms.css({
						backgroundColor: 'white',
						color: 'orange',
						border: '1px solid grey'
					});
				return true;
			}

suis vraiment une poire, un truc simple qui me pose problème

[Bovino]

Tu as 2 boutons radio, donc toujours au moins un qui n'est pas coché...

normal => !this.checked
donc il rentrera au moins une fois dans ta boucle si l'une de tes checkbox n'est pas sélectionnée

[gtraxx]

oui justement comment résoudre ce probléme, je veux juste envoyer un message d'erreur si l'un des deux boutons radio n'est pas cochés sa va de sois
Je ne vois pas trop comment faire pour lui dire si une des deux n'est pas coché envoi lui sa sinon tu lui affiche le bouton,

j'ai changer un peux mon 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
if (jQuery('div.ParentsQuest_4 :radio').is(':not(:checked)')) {
					string = this.name + ": non coché" + "\n";
					alert(string);
				return false;
			}else {
				var sendForms = jQuery('#process #sendForms');
					sendForms.removeAttr('disabled', 'disabled');
					sendForms.css({
						backgroundColor: 'white',
						color: 'orange',
						border: '1px solid grey'
					});
				return true;
			}

Forcement il me renvoi false a chaque coup

[Bovino]

Un truc du style

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
 
var verif=false;
jQuery('div.ParentsQuest_4 :radio').each(function(elt){
if(elt.checked){verif=true;return}
}
if (!verif){
					string = this.name + ": non coché" + "\n";
					alert(string);
				return false;
			}else {
				var sendForms = jQuery('#process #sendForms');
					sendForms.removeAttr('disabled', 'disabled');
					sendForms.css({
						backgroundColor: 'white',
						color: 'orange',
						border: '1px solid grey'
					});
				return true;
			}

[gtraxx]

je viens d'essayer ton code mais cela me renvoi systématiquement false
Même si je coche il me renvoi le message

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
 
var string = '';
var verif=false;
			jQuery('div.ParentsQuest_4 :radio.quantity').each(function(elt){
					if(elt.checked){verif=true;return}
				})
			if(!verif){
					string = this.name + ": non coché" + "\n";
					alert(string);
				return false;
			}else {
				var sendForms = jQuery('#process #sendForms');
					sendForms.removeAttr('disabled', 'disabled');
					sendForms.css({
						backgroundColor: 'white',
						color: 'orange',
						border: '1px solid grey'
					});
				return true;
			}
			});

[Bovino]

C'est normal qu'au fil du post div.ParentsQuest_8 soit devenu div.ParentsQuest_4 ?

[le_chomeur]

si ce sont des boutons radio, on attend forcément un choix donc mets en un par défaut ^^

[gtraxx]

C'est normal qu'au fil du post div.ParentsQuest_8 soit devenu div.ParentsQuest_4 ?

oui c normal lol, je doit le faire pour les 9

si ce sont des boutons radio, on attend forcément un choix donc mets en un par défaut ^^

Je veux bien mais cela va fausser mes résultats pour la fonction mathématique qui ajoute un certain prix dans une div caché
Puis c'est mon boss qui ma demander de faire une validation des radios

[Bovino]

Essaye peut-être

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
if (jQuery('div.ParentsQuest_4 input:checked').length==0) {
					string = this.name + ": non coché" + "\n";
					alert(string);
				return false;
			}else {
				var sendForms = jQuery('#process #sendForms');
					sendForms.removeAttr('disabled', 'disabled');
					sendForms.css({
						backgroundColor: 'white',
						color: 'orange',
						border: '1px solid grey'
					});
				return true;
			}

[gtraxx]

c'est marrant sa fonctionne

je pensais pas que length aurai une influence sur un radio,

chapeau bovino

maintenant je doit copier-coller pour chaque class ParentsQuest_ j'en ai neuf en tout a moins d'ajouter un each qui bouclerai

genre : ParentsQuest_ + num ..... une idée

[Bovino]

je pensais pas que length aurai une influence sur un radio

Il s'agit d'une méthode de jQuery

Code :

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

jQuery('div.ParentsQuest_4 input:checked')

te renvoie un tableau des éléments input checked dans div.ParentQuest_4.
Donc si le length est 0, c'est qu'aucun n'est sélectionné.

EDIT
Oui, tu peux boucler sur un indice avec 'div.ParentQuest_'+i

Code :

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

1
2
3
4
var i=0;
while(jQuery('div.ParentQuest_'+i){
    //ton code
}

[gtraxx]

mmm je sens qu'ont y arrive presque lol, il n'effectue pas la boucle du moins il ne me retourne qu'un

undefined : non coché

Mes class sont numérotés de 1 à 9 :

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
var i= 0;
			while(jQuery('div.ParentsQuest_'+i)){
				//alert(jQuery('div.ParentsQuest_'+i));
				if (jQuery('div.ParentsQuest_'+i+' input:checked').length == 0) {
					string = jQuery('div.ParentsQuest_'+i+' :radio.quantity').attr('name') + ": non coché" + "\n";
					alert(string);
				return false;
				}else {
					var sendForms = jQuery('#process #sendForms');
						sendForms.removeAttr('disabled', 'disabled');
						sendForms.css({
							backgroundColor: 'white',
							color: 'orange',
							border: '1px solid grey'
						});
					return true;
				}
			};

[Bovino]

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
var i= 1;
			while(jQuery('div.ParentQuest_'+i)){
				//alert(jQuery('div.ParentQuest_'+i));
				if (jQuery('div.ParentsQuest_'+i+' input:checked').length == 0) {
					string = jQuery('div.ParentsQuest_'+i+' :radio.quantity').attr('name') + ": non coché" + "\n";
					alert(string);
				return false;
				}else {
					var sendForms = jQuery('#process #sendForms');
						sendForms.removeAttr('disabled', 'disabled');
						sendForms.css({
							backgroundColor: 'white',
							color: 'orange',
							border: '1px solid grey'
						});
					return true;
				}
i++;
			};

[gtraxx]

déjà essayer avec 1 en faites il vérifie bien le numéro 1 mais si je le coche et que je reverifie il m'affiche le bouton disabled sans vérifier les autres numéro donc il passe entre guillemet un coup dans la boucle sa vraiment la faire bref mon navigateur m'insulte lol

même essayer comme sa :

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
var i= 1;
			while(i <= 9){
				i++;
				if (jQuery('div.ParentsQuest_'+i+' input:checked').length == 0) {
					string = jQuery('div.ParentsQuest_'+i+' :radio.quantity').attr('name') + ": non coché" + "\n";
					alert(string);
				return false;
				}else {
					var sendForms = jQuery('#process #sendForms');
						sendForms.removeAttr('disabled', 'disabled');
						sendForms.css({
							backgroundColor: 'white',
							color: 'orange',
							border: '1px solid grey'
						});
					return true;
				}
			};

il vérifie la class avec le num 1 ensuite plus rien

[Bovino]

Tu as oublié le i++ en fin de while...

EDIT
Non, en fait, c'est le return qui doit perturber !

[gtraxx]

+ 1 pour bovino c'est bien le return false qui perturbais l'execution cependant lorsque je valide, il m'affiche bien chaque alert mais si je clique sur le radio de ParentsQuest_1 il libére mon bouton surement du au var i = 1;

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
var i= 1;
			while(i <= 9){
 
				i++;
 
				if (jQuery('div.ParentsQuest_'+i+' input:checked').length == 0) {
					string = jQuery('div.ParentsQuest_'+i+' :radio.quantity').attr('name') + ": non coché" + "\n";
					alert(string);
				}else {
					var sendForms = jQuery('#process #sendForms');
						sendForms.removeAttr('disabled', 'disabled');
						sendForms.css({
							backgroundColor: 'white',
							color: 'orange',
							border: '1px solid grey'
						});
				}
 
			};