Discussion :

[Tellounet]

Bonjour,

Je construis dynamiquement une liste de valeurs et l'utilisateur du site peut en sélectionner une grâce aux boutons radio générés au début de chaque ligne.

Pour être certain qu'il en choisisse bien une (on suppose qu'il ne veut pas faire planter mon joli code), je fais une vérification js au onsubmit du formulaire:

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
function selectDoublon(){
 
	var radio_choice = false;
	var counter;
 
	for (counter = 0; counter < formdoub.radioDoublon.length; counter++)
	{
		if (formdoub.radioDoublon[counter].checked)
			radio_choice = true;
	}
 
	if (!radio_choice)
	{
		alert('Veuillez choisir un compte à fusionner avant de valider.');
		return false;
	}
	else
	{
		return true;
	}
 
}

formdoub est l'id/nom de mon formulaire, et radioDoublon le nom de mon ensemble de boutons radio.

Cette vérification fonctionne très bien, sauf lorsqu'il n'y a qu'une seule ligne.
En fouillant un peu je me rends compte que dans ce cas formdoub.radioDoublon.length me renvoie undefined.
Lorsque j'ai par exemple 7 valeurs, ça me renvoie bien 7.

C'est donc l'unicité du bouton qui semble me poser problème.
Quelles pourraient être la cause et la solution, sachant que je ne dois pas sélectionner la première par défaut (à cause des étourdis qui ne regardent pas ce qu'ils font).

Merci d'avance

[franculo_caoulene]

Salut,

Le principe du bouton radio est bel et bien de ne laisser l'utilisateur sélectionner qu'une option. Pour se faire, il faut définir le même attribut name pour tous les boutons radio.

[Tellounet]

Bien sûr, c'est ce que j'ai fait, le nom de mon élément est bien radioDoublon et l'utilisateur n'en sélectionne qu'un.

Seulement, lorsque l'affichage dynamique ne crée qu'une ligne (donc une seule valeur pour de ce radio), l'attribut length n'a pas de valeur et donc ma vérification tourne en rond

[Bovino]

Salut,

Tout d'abord, pour que ton code respecte mieux les standards, il est préférable de passer par l'objet document :

Code :

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

1
2
3
4
5
for (counter = 0; counter < document.formdoub.radioDoublon.length; counter++)
{
	if (document.formdoub.radioDoublon[counter].checked)
		radio_choice = true;
}

ensuite, cette façon de récupérer des éléments est problématique car elle renvoie habituellement une collection, mais si le name est unique, c'est l'élément lui-même qui est référencé.
Tu peux éventuellement contourner en passant par

Code :

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

document.getElementsByName();

qui renvoie systématiquement une collection.

[Tellounet]

Je ne te surprendrai pas en t'annonçant que ça fonctionne impeccablement avec document.getElementsByName().

Merci beaucoup, Ô Grand Cornu, de nous accorder tes lumières.

Ca m'apprendra à chercher du code sur le net, tiens...
enfin, ailleurs qu'ici

D'ailleurs lorsque je rajoute une verif js sur mes formulaires, je fais instinctivement document.getElementsById(). La différence est-elle subtile ou fondamentale?

[franculo_caoulene]

Fondamentale, document.getElementById retourne un objet du DOM (un élément), document.getElementsByName retourne une collection d'objets du DOM.

Pour info document.getElementsByTagName existe aussi.

[E.Bzz]

D'ailleurs lorsque je rajoute une verif js sur mes formulaires, je fais instinctivement document.getElementsById().

C'est l'instruction à privilégier dans une fonction pour accéder à un objet précis

A+