Sujet Précédent Sujet Suivant

Formulaire

Gluondupc Messages postés 1 Date d'inscription lundi 20 janvier 2014 Statut Membre Dernière intervention 20 janvier 2014 - 20 janv. 2014 à 10:36
f0xi Messages postés 4205 Date d'inscription samedi 16 octobre 2004 Statut Modérateur Dernière intervention 12 mars 2022 - 1 févr. 2014 à 19:40
Bonjour,
J'ai un problème avec un formulaire avec des "checkbox" et des "function showRadio()".
J'ai réussi à faire un code qui s'appel "Séquence 1:" qui m'affiche des "checkbox" en fonction de l'activation d'autres Checkbox, mais j'aimerai faire plusieurs lignes.
J'ai fait la "séquence 1" dans le code et j'"aimerai faire les séquences de 1 à 10 en récupérant les variables en local, mais je n'y arrive pas.
Bien sur, tout ce que j'ai fait c'est copier des morceaux de code sur le net et les modifier, mais là je but.
Merci à vous, en esperant que vous aurez plus de temps à me concacrer que ma demande est clair.
Voici le code: 

<html>
<head>
	<meta charset="utf-8">
	<title>Développé par </title>
	<style type="text/css">#D1, #D2, #D3, #D4, #D5, #D6, #D7 {display: none;}</style>
	<script type="text/javascript">
	function showRadio() {
		var n = document.form.Sq1.length;
		for(i=1;i<=n;i++) {
			if(document.getElementById('choix'+i).checked == true) {
				document.getElementById('D'+i).style.display = "block";
			} else {
				document.getElementById('D'+i).style.display = "none";
			}
		}
	  }
	</script>
</head>

<body>

<CAPTION> <p><b>Definition de la sequence d'essai :</b></p></CAPTION> 
 
	<form name="form" action="" method="post">
	<br>
		<CAPTION><TR> Sequence 1:</CAPTION>
		      <label>Mouvement moteur<input type="radio" id="choix1" name="Sq1" value="Mvt1" onclick="showRadio()" /></label> </TR>
		      <label>Mesure des potentiometres <input type="radio" id="choix2" name="Sq1" value="Mesur1" onclick="showRadio()" /></label> 
		      <label>Retour a Zero Moteur <input type="radio" id="choix3" name="Sq1" value="Zero1" onclick="showRadio()" /></label> 
		<div id="D1">
		<label> Mouvement <input type="radio" name="Numero Moteur Sq1" value="Moteur 1" checked >Moteur 1
				<input type="radio" name="Numero Moteur Sq1" value="Moteur 2">Moteur 2 
				      
				<input type="radio" name="Cablage Sq1" value="Nominal" checked >Nominal
				<input type="radio" name="Cablage Sq1" value="Redondant">Redondant
				      
				<input type="radio" name="Sens Sq1" value="CW" checked >CW
				<input type="radio" name="Sens Sq1" value="CCW">CCW
				      
				Nombre de pas <input type="text" name="NbPas Sq1" size="5">
	</label>
	</div>

	<div id="D2">
		<label>Mesure des potentiometres</label>
	</div>
	<div id="D3">
	<label> 	<input type="radio" name="Numero Moteur Sq1" value="Moteur 1" checked >Moteur 1
				<input type="radio" name="Numero Moteur Sq1" value="Moteur 2">Moteur 2 
				      
				<input type="radio" name="Cablage Sq1" value="Nominal" checked >Nominal
				<input type="radio" name="Cablage Sq1" value="Redondant">Redondant
	</div>
</br>
</br>
</form>

</body>
</html>

1 réponse

Réponse 1 / 1
f0xi Messages postés 4205 Date d'inscription samedi 16 octobre 2004 Statut Modérateur Dernière intervention 12 mars 2022 35
1 févr. 2014 à 19:40
Petit exemple de remplissage selon un choix, avec script et style. 
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
*,html{
  font-family:calibri,arial,tahoma;
}

body{
  font-size:12pt;
}

content[hidden]{
  display:none;
  width:0;
  height:0;
  left:-9999px;
}

fieldset,input[type="text"],select{
  border:1px solid #ccc;
  border-radius:3px;
  box-shadow:none;
}
input[type="text"],select{  
  font-size:12pt;
  height:24px;
  line-height:24px;
}
input[type="text"]:focus,select:focus{
  box-shadow:0 0 3px #ccc;
}

fieldset{
  display:block;
  margin-top:28px;
  padding:8px;
}
fieldset legend{ 
  display:block;
  position:relative;
  margin-top:-22px;
  left:0px;
  font-weight:bolder;
  color:#fff;
  background-color:#ccc;
  border-top-left-radius:3px;
  border-top-right-radius:3px;
  height:24px;
  line-height:24px;
  padding:0 8px;
}

fieldset label{
  display:inline-block;
  min-width:81px;
  margin-right:4px;
}

fieldset select{
  min-width:81px;
}

fieldset input[type="text"]{
  min-width:81px;
  color:#222;
}
fieldset input[type="text"]:focus{
  color:#909;
}
fieldset input[type="button"]{
  min-width:64px;
}
</style>
	
<script>
function choice(select){
  if(select)
  {
    var value  = parseInt(select.value);
    if(value == NaN) value = 0;
    var target = document.getElementById("content");
    var source = document.getElementById("c_"+value);
    target.innerHTML = source.innerHTML; 
    if(target.innerHTML.length > 0) 
    {
      target.style.display = 'block'
    }
    else 
    {
      target.style.display = 'none';
    }
  }
}
</script>
</head>

<body>
<h4>Test affichage</h4> 

<fieldset id="settings"> 
  <legend>Choix</legend>
  <select id="choice" onchange="choice(this);">
    <option value="0" selected>-- Choisissez une option --</option>
    <option value="1">C 1</option>
    <option value="2">C 2</option>
    <option value="3">C 3</option>
  </select>
</fieldset>

<content id="content" style="display:none;">
</content>

<!-- Contenus -->

<content id="c_0"></content>
	
<content hidden id="c_1">
  <fieldset>
    <legend>C1</legend>
    <p><label>C 1 1</label><input type="text" value="1" id="c_1_1"/></p>
    <p><label>C 1 2</label><input type="text" value="2" id="c_1_2"/></p>
    <p><label>C 1 3</label><input type="text" value="3" id="c_1_3"/></p>
  </fieldset>
</content>

<content hidden id="c_2">
  <fieldset>
    <legend>C 2</legend>
    <p><label>C 2 1</label><input type="text" value="4" id="c_2_1"/></p>
    <p><label>C 2 2</label><input type="text" value="5" id="c_2_2"/></p>
    <p><label>C 2 3</label><input type="text" value="6" id="c_2_3"/></p>
  </fieldset>
</content>
<content hidden id="c_3">
  <fieldset>
    <legend>C3</legend>
    <p><label>C 3 1</label><input type="text" value="7" id="c_3_1"/></p>
    <p><label>C 3 2</label><input type="text" value="8" id="c_3_2"/></p>
    <p><label>C 3 3</label><input type="text" value="9" id="c_3_3"/></p>
  </fieldset>
</content>
</body>
</html>

0

Discussions similaires

Remplir un formulaire PDF à partir di'un fichier excel
bgame -
the_little_big_man -

3 réponses
Tkinter et les bases de données
dahrprog -
dahrprog -

2 réponses
afficher pdf dans userform (vba excel)
37224Scan -
mortalino -

2 réponses
Saisie de données par formulaire Excel
Edouardt -
hordmomo -

22 réponses
treeview tkinter
mohamed2511 -
Gandalfix -

9 réponses
Rejoignez-nous