Discussion :

[lcoulon]

Bonjour

Grace à 3 radioboxes, je veux que l'un des 3 div puissent apparaitre en fonction du choix de l'utilisateur, cela fonctionne.
mais par défaut, au chargement de la page et sans clic de l'utilisateur aucun div ne s'affiche, je voudrai que ce soit systématiquement le div id="one" qui soit affiché même si l'utilisateur n'a encore rien cliqué.


Pouvez vous me dire ce que je dois ajouter à mon code svp ?

Merci beaucoup

Code :

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

1
2
3
4
5
6
7
8
9
10
11
<form name="create" id="create" method="post" enctype="multipart/form-data">
 
<input name="pagetype" type="radio" value="1" onclick="showhidediv(this);"/>One <br />
<input name="pagetype" type="radio" value="2"  onclick="showhidediv(this);"/>two<br>
<input name="pagetype" type="radio" value="3"  onclick="showhidediv(this);"/>three<br>
 
<div id="one" class="CF" style="display:none;"  >One </div>
<div id="two" style="display:none;" class="CF" >Two</div>
<div id="three" style="display:none;" class="CF" >Three</div>
 
</form>

Code :

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

1
2
3
4
5
6
7
8
<script language="JavaScript" type="text/javascript">
function showhidediv(rad){
var rads=document.getElementsByName(rad.name);
document.getElementById('one').style.display=(rads[0].checked)?'block':'none' ;
document.getElementById('two').style.display=(rads[1].checked)?'block':'none' ;
document.getElementById('three').style.display=(rads[2].checked)?'block':'none' ;
}
</script>

[Invité]

Bonjour,

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
12
<form name="create" id="create" method="post" enctype="multipart/form-data">
 
  <label><input name="pagetype" type="radio" value="1" onclick="showhidediv(this);" checked="checked"/>One</label>
  <br />
  <label><input name="pagetype" type="radio" value="2"  onclick="showhidediv(this);"/>two</label>
  <br>
  <label><input name="pagetype" type="radio" value="3"  onclick="showhidediv(this);"/>three</label>
  <br>
  <div id="div-1" class="CF" style="display:block;">One </div>
  <div id="div-2" class="CF" style="display:none;">Two</div>
  <div id="div-3" class="CF" style="display:none;">Three</div>
</form>

Code javascript :

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

1
2
3
4
5
6
function showhidediv(rad) {
  var id = rad.value;
  for(var i=1; i<=3; i++){
    document.getElementById('div-'+i).style.display = (i==id)?'block':'none' ;
  }
}

[lcoulon]

Merci beaucoup.