Discussion :

[Psycho08]

onjour,

je suis débutant avec jQuery et j'essai depuis un bon moment de récupérer les différents attributs "name" de mes inputs de type radio et qui sont groupés (donc certains ont le même nom) dans mon formulaire.

Le but est de connaitre combien il y a de nom de groupe différents dans mon formulaire. J'ai essayé avec .each mais ça ne fonctionne pas au mieux je récupère le premier élément?

Voici mon code html:

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
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
<form action="#" method="post" name="survey" id="survey" lang="en">
			<table cellpadding="0" cellspacing="0" id="qSurvey">
				<tr>
					<!--[if lte IE 7]><td rowspan="14" class="blankCol">&nbsp;</td><![endif]-->
					<th colspan="5">*1. When visiting the website, you've viewed our presentation video clip; please tell us what you think:</th>
				</tr>
				<tr>
					<td class="firstCol">&nbsp;</td>
					<td><label for="video1"><input name="video" type="radio" id="video1" value="like" />I loved it</label></td>
					<td colspan="2">&nbsp;</td>
					<td class="lastCol">&nbsp;</td>
				</tr>
				<tr>
					<td class="firstCol">&nbsp;</td>
					<td><label for="video2"><input name="video" type="radio" id="video2" value="don't like" />I didn't like it</label></td>
					<td colspan="2">&nbsp;</td>
					<td class="lastCol">&nbsp;</td>
				</tr>
				<tr>
					<td class="firstCol">&nbsp;</td>
					<td><label for="video3"><input name="video" type="radio" id="video3" value="too long" />It's too long!!</label></td>
					<td colspan="2">&nbsp;</td>
					<td class="lastCol">&nbsp;</td>
				</tr>
				<tr>
					<td colspan="5">&nbsp;</td>
				</tr>
				<tr>
					<th colspan="5">*2. If you could install the product in one room in your house, where would that be?</th>
				</tr>
				<tr>
					<td class="firstCol">&nbsp;</td>
					<td><label for="room1"><input name="roomGroup" type="radio" id="room1" value="kitchen" />Kitchen</label></td>
					<td><label for="room2"><input name="roomGroup" type="radio" id="room2" value="bathroom" />Bathroom</label></td>
					<td><label for="room3"><input name="roomGroup" type="radio" id="room3" value="closet" />Closet</label></td>
					<td class="lastCol">&nbsp;</td>
				</tr>
				<tr>
					<td class="firstCol">&nbsp;</td>
					<td><label for="room4"><input name="roomGroup" type="radio" id="room4" value="garage" />Garage</label></td>
					<td><label for="room5"><input name="roomGroup" type="radio" id="room5" value="hall" />Hall</label></td>
					<td><label for="room6"><input name="roomGroup" type="radio" id="room6" value="laundry room" />Laundry room</label></td>
					<td class="lastCol">&nbsp;</td>
				</tr>
				<tr>
					<td class="firstCol">&nbsp;</td>
					<td><label for="room7"><input name="roomGroup" type="radio" id="room7" value="workshop" />Workshop</label></td>
					<td colspan="2">&nbsp;</td>
					<td class="lastCol">&nbsp;</td>
				</tr>
				<tr>
					<td colspan="5">&nbsp;</td>
				</tr>
				<tr><th colspan="5">*3. What is your overall impression of the product?</th></tr>
				<tr>
					<td class="firstCol">&nbsp;</td>
					<td><label for="opinion1"><input name="opinionGr" type="radio" id="opinion1" value="wow" />Wow!</label></td>
					<td colspan="2">&nbsp;</td>
					<td class="lastCol">&nbsp;</td>
				</tr>
				<tr>
					<td class="firstCol">&nbsp;</td>
					<td><label for="opinion2"><input name="opinionGr" type="radio" id="opinion2" value="cool" />Cool</label></td>
					<td colspan="2">&nbsp;</td>
					<td class="lastCol">&nbsp;</td>
				</tr>
				<tr>
					<td class="firstCol">&nbsp;</td>
					<td><label for="opinion3"><input name="opinionGr" type="radio" id="opinion3" value="blah" />Blah…</label></td>
					<td colspan="2">&nbsp;</td>
					<td class="lastCol">&nbsp;</td>
                        <div id="validation">
				<input name="submitBtn" id="submitBtn" type="button" value="Submit" />
			</div>
		</form>

Voici mon code jQuery:

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
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
$(document).ready(function()
	{
		var msg = "";
		function showErrMsg(eMsg)
		{
			/*if(valid==false)
			{*/
				$("table#errMsg tr td").text(eMsg);
			/*}*/
		}
		
		$("#submitBtn").click(function () 
		{
			var nRadioQ = 3 ;//nombre de question de type radio (nb de groupe)
			var valid = false;
			var chRadioL = $("input[type='radio']:checked").length;
			var cRadioGr = $("input[type='radio']");
			var tempNameCheck = "";
			var firstName = $("#firstName").val();
			var lastName = $("#lastName").val();
			var email = $("#email").val();
			var emailRegEx = /^([a-zA-Z0-9])(([a-zA-Z0-9])*([\._\+-])*([a-zA-Z0-9]))*@(([a-zA-Z0-9\-])+(\.))+([a-zA-Z]{2,4})+$/;
			
			if (chRadioL != nRadioQ)
			{
				valid = false;
				if (chRadioL < 3)
				{
					msg = "You don't fill all the questions";
					$.each(cRadioGr, function(i,nameVal) 
					{
						var nameValAttr = nameVal.attr("name");
						alert (nameValAttr); //ne fonctionne pas
						
 					});
				}
				else if (chRadioL > 3)
				{
					msg = "Oops! A error occured. Please refresh the page (F5 or Ctrl+R)";
				}
			}
			else if (firstName=="" || lastName=="" || email=="")
			{
				valid = false;
				msg = "Fill the info about you please";
				
			}
			
			else if (email)
			{
				if (email.match(emailRegEx))
				{
					valid = true;
					msg = "You got it big boy!";
				}
				
				else
				{
					valid = false;
					msg = "Your adresse email is invalid";
				}
			}
			else
			{
				valid = true;
				msg = "Just 3 questions to answer! Come on! You can do it!";
			}
			showErrMsg();
		});
	});

Si quelqu'un peut me dire svp comment obtenir non pas le premier élément (.attr("name")) mais tous les noms.

Merci d'avance

Jim

[Invité]

Bonjour,
un bout de code à tester/adapter :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
					var nameValAttr = '';
					var nRadioQ = 0; // nombre de groupe(s) de type radio
					$("input[type=radio]").each(function() 
					{
						if($(this).attr("name") != nameValAttr) {
							nameValAttr = $(this).attr("name");
							alert ('groupe : ' + nameValAttr); // nom du groupe
							nRadioQ++;
						}
 					});
					alert ('nbre de groupe(s) : ' + nRadioQ); // nombre de groupe(s)

[Psycho08]

Une erreur de ma part :

Code :

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

1
2
3
4
5
$.each(cRadioGr, function(i,nameVal) 
{
	var nameValAttr = $(this).attr("name");
	alert (nameValAttr); //maintenant ça fonctionne
});