11548 sujets

JavaScript, DOM et API Web HTML5

boujour tout le monde, voila je débutte en javascript et j'arrive pas avec le code qui suit, à rendre mon bouton "bouton" clicable uniquement si un de mes deux bouton radio est coché.

code :


<html>
<head>
<title>test </title>
<script language="JavaScript" type="text/javascript">


function verif_button()
{ window.alert("titi");
var radio1=document.maforme.getElementById("radid1");
var radio2=document.maforme.getElementById("radid2");
if ((radio1.checked) || (radio2.checked ))
{
window.alert("tata");
document.maforme.bouton.disabled = false;
}
else
{
window.alert("toutouille");
document.maforme.bouton.disabled = true;
}
}

</script>
</head>
<body>
<FORM name="maforme" action="?" method="POST">

<INPUT type= "radio" id ="radid1" name="radstate" value="accepted" onclick="verif_button();" > I Accepte this set <br>
<INPUT type= "radio" id ="radid2" name="radstate" value="rejected" onclick="verif_button();" > I Refuse this set
<br><br>
<input type="submit" name="bouton" value="ok" disabled="disabled" >

</body>
</form>
</html>




merci de me donner un coup de main, et soyez indulgent, je débute Smiley biggrin


edit : le pb : IE me dit à propos de ces ligne :

var radio1=document.maforme.getElementById("radid1");
var radio2=document.maforme.getElementById("radid2");

que l'objet ne gere pas cette méthode ou cette propriété
Modifié par sadkat (08 Feb 2008 - 11:55)
Ba il marche très bien ton code !!! .... après quelques petites modification Smiley cligne


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<title>test </title>
		<script language="JavaScript" type="text/javascript">
			function verif_button() { 
			<!--
				//window.alert("titi");
				[#red]var radio1=document.getElementById("radid1");
				var radio2=document.getElementById("radid2");[/#]
				if ((radio1.checked) || (radio2.checked )) {
					//window.alert("tata");
					document.maforme.bouton.disabled = false;
				} else{
					//window.alert("toutouille");
					document.maforme.bouton.disabled = true;
				}
			}
			// -->
		</script>
	</head>
	<body>
		<FORM name="maforme" action="?" method="POST">
			<INPUT type= "radio" id ="radid1" name="radstate" value="accepted" onclick="verif_button();" > I Accepte this set <br>
			<INPUT type= "radio" id ="radid2" name="radstate" value="rejected" onclick="verif_button();" > I Refuse this set
			<br><br>
			<input type="submit" name="bouton" value="ok" disabled="disabled" >
		[#red]</form>
	</body>[/#]
</html>


Donc, 3 petits trucs:
* Pense a mieux structurer ta page HTML, en mettant des tabulations sur l'arborescence du code (comme j'ai fais)
* Tu te rendra compte de choses étrange... comme ici où tu as mis la balise de fin du body avant la balise de fin du form !
* Quand tu fais un getElementById tu n'as pas besoin de te placer "sous" ton form tu peux cibler n'importe quel élément (presque) de ta page actuel (ton body quoi) avec des Id.

PS: ce n'était pas un probleme que sur IE, firefox po content aussi Smiley cligne

J'espère t'avoir aidé et ne pas avoir été méchant Smiley lol
KalNex
parfait !! merci beaucoup, d'un c'est bien expliqué, de deux c'est gentillement dit, et de trois ça marche !!!!!!!
encore une chose svp :

si radio1.checked signifit que le bouton radio est sélectionné

est ce que lst.selected signifi que quelque chose est selectionné dans ma liste lst ?????

j'invente la pour la liste, alors c'est possible que ce soit hors sujet Smiley confused

En gros ce que je veux c'est traduire en javascript "il y a qqch de selectionné ds ma liste"
Modifié par sadkat (08 Feb 2008 - 14:51)
tu peux mettre un événement dans le select :
<select name="mylist" id="mylistId" onChange="selec()">


ta fonction selec() sera exécuté a chaque changement de la liste.

Sinon tu peux juste vérifier qu'on a cliqué sur le form (onClick="...").

Explique mieux si ce n'est pas ça Smiley langue