Déselectionner un radio button.

**Mehdi Feki** · 14/11/2007, 12h34

Environnement ASP.NEt
Browser IE

Bonjour,

J'éssai d'ajouter le comportement de deselction sur le radio button.

Voici mon code

Code js :

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

1
2
3
4
5
6
7
8
 
script type="text/javascript" language="javascript">
function clear_radio_button(radioButton) 
{
   radioButton.checked=!radioButton.checked;
 }
}
</script>

Ce code ne marche pas avec l'event on click parce que la RB change d'état avant le déclenchement de l'event.

J'ai essayé aussi l'event onmousepress, mais le code serveur encapsule la RB dans un span

Code html :

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

1
2
 
<span onmousepress="clear_radio_button(this);"><input id="ctl00_cphCenter_gdvAllFormations_ctl02_rdbGarder" type="radio" name="Garder" value="ctl00$cphCenter$gdvAllFormations$ctl02$rdbGarder" onclick="" /></span>

Si quelqu'un a une idée comment faire !!

Merci d'avance.

**SpaceFrog** · 14/11/2007, 13h04

onmouseup ?

ou alors setTimeout ...

**le_chomeur** · 14/11/2007, 13h18

j'ai essayé ceci et cela a l'air de fonctionner :-)

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
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
function verifEtat(maRadio,etat){
	maRadio.checked = (!maRadio.checked) ? true:false;
}
</script>
</head>
<BODY>
<input type="radio" name="test" id="toto" onmouseup="verifEtat(this)" />
</BODY>
</html>

J'ai essayé plusieurs évènement, et la checkbox est coché sur l'évènement "onmouseup"...

Bon courage

**Mehdi Feki** · 14/11/2007, 13h35

Merci pour les réponses.

En fait comme onmousepress, quand j'ajoute l'event onmouseup, mon control serveur me génére ce code :

Code html :

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

1
2
 
<span onmouseup="clear_radio_button(this);"><input id="ctl00_cphCenter_gdvAllFormations_ctl02_rdbGarder" type="radio" name="Garder" value="ctl00$cphCenter$gdvAllFormations$ctl02$rdbGarder" onclick="" /></span>

Sinon j'ai essayé avec une simple page html et ça marche une fois sur 3, ça dépend où et comment je clique sur le bouton

.

**SpaceFrog** · 14/11/2007, 13h41

donc essaye de colle un setTimeout sur le onmouseup ...

onmousepress n'est pas crossbrowser ..

**Mehdi Feki** · 14/11/2007, 14h07

Envoyé par SpaceFrog

donc essaye de colle un setTimeout sur le onmouseup ...

onmousepress n'est pas crossbrowser ..

Merci.

Juste une derniere question pour tester ta solution. Existe-t-il un moyen de récuperer les controls childs en js, parce que comme tu vois le onmouseup se place automatiquement dans un span et l'id du radio button est générique.

**SpaceFrog** · 14/11/2007, 14h13

id générique ?
pas compris ...
tu peux mettre un peu de code html pour expliciter ...

et le onmousup sur le span ?

montre ta structure stp

**le_chomeur** · 14/11/2007, 14h20

spacefrog : en .net , les id des controles sont généré dynamiquement par le serveur , il ne peut donc pas travailler avec l'id

Edit : j'ai dit une connerie ... les id sont bel et bien généré dynamique et il peut récupèrer l'id gènéré via une propriété de dotnet a intègrer dans son js genre :

moncontrol.id

qui sera généré lors de la génération de la page ...

**Mehdi Feki** · 14/11/2007, 14h50

Envoyé par SpaceFrog

id générique ?
pas compris ...
tu peux mettre un peu de code html pour expliciter ...

et le onmousup sur le span ?

montre ta structure stp

Oui, voila le code généré (c'est le même que celui de mon avant dernier post):

Code html :

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

1
2
 
<span onmouseup="clear_radio_button(this);"><input id="ctl00_cphCenter_gdvAllFormations_ctl02_rdbGarder" type="radio" name="Garder" value="ctl00$cphCenter$gdvAllFormations$ctl02$rdbGarder" onclick="" /></span>

Comme tu vois, mon control serveur génére un span parce que le control en question ne gère pas le onmouseup. En fait c'est un control utilisateur (qui étend la fonctionnalité de base du radio button) donc je n'ai pas la main sur le rendu html qu'il génére.

Sinon, je pourrais récuperer l'id du control et construire l'appel à la fonction javascript avec du code C# coté serveur, mais je voudrais éviter pour l'instant je préfére une solution en pure js.

Encore

**SpaceFrog** · 14/11/2007, 14h57

tu n'as qu'un input par span ?

avec l'id du span l'input contenu est :

Code :

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

document.getElementById('idduspan').getElementsByTagName('input')[0]

**Mehdi Feki** · 14/11/2007, 15h51

Bon, je galere encore avec mon radio button.

voila où est ce que j'en suis.

Code html :

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

1
2
 
    <span onmouseup="setTimeout('clear_radio_button(\'ctl00_cphCenter_gdvAllFormations_ctl02_rdbGarder\')',0);"><input id="ctl00_cphCenter_gdvAllFormations_ctl02_rdbGarder" type="radio" name="Garder" value="ctl00$cphCenter$gdvAllFormations$ctl02$rdbGarder" onclick="" /></span>

Code javascript :

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

1
2
3
4
5
function clear_radio_button(radioButton) 
{
 var obj=document.getElementById(radioButton);
 obj.checked=!obj.checked;
}

ça marche bien lorsque mon radio button est selectionné mais il faut cliqué deux fois de suite lorsqu'il est déselectionné.

Et complétement l'inverse si je transforme mon onmouseup par onmousedown.

Je ne vois pas du tout ce qui se passe.