Aller au contenu

Bouton Radio + Javascript


Portekoi

Sujets conseillés

Bonsoir,

j'ai 4 boutons radio du même nom avec 4 valeurs différentes. Mon formulaire s'appelle "Formulaire".

Ce que j'aimerais, c'est un lien qui, lorsque je clique dessus, décoche le bouton radio choisie dans le but de réinitialiser, non pas le formulaire, mais une certaine partie.

En gros, décocher un bouton radio par un lien ^_^

Mon code :

<table>
<tr>
 <td>
 <input type="radio" value="1" name="tycin"/> Passeport
 <input type="radio" value="2" name="tycin"/> Carte d'identité
 <input type="radio" value="3" name="tycin"/> Carte de résident
 <input type="radio" value="4" name="tycin"/> Autre
 </td>
 <td>
 <a href="#" onclick="javascript:formulaire.tycin.checked=false">X</a>
 </td>
</tr>  
</table>

Merci

Portekoi

Lien vers le commentaire
Partager sur d’autres sites

Re,

A force de chercher, j'ai trouvé :)

Voici la solution :

A mettre dans l'entete de votre page dans des balises javascript :

function setCheckedValue(radioObj, newValue) {
if(!radioObj)
 return;
var radioLength = radioObj.length;
if(radioLength == undefined) {
 radioObj.checked = (radioObj.value == newValue.toString());
 return;
}
for(var i = 0; i < radioLength; i++) {
 radioObj[i].checked = false;
 if(radioObj[i].value == newValue.toString()) {
 radioObj[i].checked = true;
 }
}
}

Et le lien à mettre :

<a href="#" onclick="setCheckedValue(document.forms['formulaire'].elements['tycin'], '');">X</a>

Lien vers le commentaire
Partager sur d’autres sites

Et le lien à mettre :

<a href="#" onclick="setCheckedValue(document.forms['formulaire'].elements['tycin'], '');">X</a>

La dégradation risque de mal se passer pour ceux qui n'ont pas de JS sur leur navigateur pour une raison ou pour une autre. Ils vont se retrouver à cocher un # désespérément.

AMHA tu devrais plutôt créer le lien depuis ta fonction dans ton fichier .js, avec un truc qui ressemblerait à çà:

decoche = document.createElement('a');
decoche.href='#';
decoche.onclick = function()
 {
ta fonction ici
 }

Il faudra aussi que tu utilises des méthodes comme insertBefore pour placer ton lien sur la page.

Et puis tant qu'à faire:

Accessible HTML/XHTML Forms | Chapter 1 :D

Accessible HTML/XHTML Forms | Chapter 2 :whistling:

Accessible HTML/XHTML Forms | Chapter 3 :blush:

A+ :ph34r:

Lien vers le commentaire
Partager sur d’autres sites

<a href="#" onclick="setCheckedValue(document.forms['formulaire'].elements['tycin'], '');">X</a>

<{POST_SNAPBACK}>

Par ailleurs, quand tu fais une action sur le Onclick, il faut toujours ajouter "return false" pour eviter d'executer aussi ce qu'il y a sur le href.

Parce que dans ton cas, si ton formulaire se trouve en bas de page avec un scroll, le fait de clicker sur ton lien va te faire remonter aussi en haut de page...

<a href="#" onclick="setCheckedValue(document.forms['formulaire'].elements['tycin'], '');return false">X</a>

Lien vers le commentaire
Partager sur d’autres sites

Par ailleurs, quand tu fais une action sur le Onclick, il faut toujours ajouter "return false" pour eviter d'executer aussi ce qu'il y a sur le href.

Parce que dans ton cas, si ton formulaire se trouve en bas de page avec un scroll, le fait de clicker sur ton lien va te faire remonter aussi en haut de page...

<a href="#" onclick="setCheckedValue(document.forms['formulaire'].elements['tycin'], '');return false">X</a>

Oui, je l'avais fait ca, pas de soucis :)

Et pour Dudu, Internet explorer est déployé à ma boite. Je n'ai donc pour contrainte que ma conscience professionnelle mise à mal par mon boss qui demande des pagespour hier ^_^

Je vais regarder tes liens :)

A bientot

Portekoi

PS : Et une version propre de ce code, ca donnerai quoi? :)

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...