Javascript ajouter un nombre de champs de texte

webac · 21 Novembre 2007

Bonsoir,

Je souaite générer un nombre donné de champs de texte automatiquement je m'explique :

j'ai un champs quantité et un champs N° de serie je souhaite créer autant de champs n° de serie que la valeur du champs quantité.

j'ai trouvé ce script que j'ai bidouillé mais je n'arrive pas à générer le nombre souhaité de champs merci de m'éclairer.

Code:

<form name=frm method=post action=page.ext>
<label></label>
<Div ID=saisies> Produit 
  <input type=text name=P1>
   Quantité 
   <select name="QTE" id="QTE">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
  </select> 
  N°de serie
  <input type=text name=SER1>
  <input type=Button value="OK" onclick=Ajouter() />
</Div>
</Form>
<script>

var qte = document.frm.QTE.value;
var nlignes = 1;
function Ajouter(){
nlignes++
if(nlignes>=11){return false;}
saisies.insertAdjacentHTML('BeforeEnd','<BR>N° Serie '+nlignes+' <input type=text name=SER'+nlignes+'>');
};
</script>

YoyoS · 22 Novembre 2007

Une bouclette en php ? :mrgreen: Désolé j'ui une brelle en javascript, je sors

julienr · 22 Novembre 2007

je pense que document.frm.QTE.value ne va pas pour un select

Code:

var qte = document.frm.QTE.options[document.frm.QTE.selectedIndex].value

ensuite il te faut en effet une boucle

Code:

for( i=0; i<qte; i++ ) {
...
}

webac · 22 Novembre 2007

ok je suis pas expert en javascript mais ce petit bout de code fonctionne quasiment comme je le souhaite pour ceux que ça interesse voici mon code :

Code:

<html>
<head></head>
<body>
<form name=frm method=post action=page.ext> 
<div id=saisies> Produit 
  <input type=text name=P1> 
   Quantité
   <input name=QTE type=text id="QTE" size="3" maxlength="2"> 
  N°de serie 
  <input type=text name=SER> 
  <input type=Button value="Ajouter les champs" onclick=Ajouter() /> 
</Div> 
</Form> 
<script> 
var nlignes = 1; 
function Ajouter(){ 
for(nlignes=1;nlignes<=document.frm.QTE.value-1;nlignes++){ 
var donnee=document.getElementById("P1").value ;
saisies.insertAdjacentHTML('BeforeEnd','<BR>Produit <input type=text name=P'+nlignes+' value='+donnee+'>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
N°de serie <input type=text name=SER'+nlignes+'>'); 
};
};
 
</script> 
</body>
</html>

Merci pour la piste julienr