Forum d'entraide PHPFrance

bonjour les amis,

je sais que pour ajouter un input on fait appel à une fonction javascript, est ce que je peux abuser de l'aide d'un d'entre vous pour qu'il me montre comment faire?
je suis un null en js.
merci

en fait le problème, c'est que même si il y avait une bonne âme parmis nous, elle pourrait pas t'aider, ta demande est beacoup trop imprécise...
dans l'attente de précisions ...

merci,
j'attendais une réplique pour mieux exposer mon problème.
voila:
j'ai une page en html qui permet aux clients de commander des articles, à cet effet, j'ai crée un champ avec des choix multiples comme celà;

Code : Tout sélectionner

<td width="420"><select name="sujet">
<option selected>
<OPTION value="1" >article1</OPTION>
<OPTION value="2" >article1</OPTION>
<OPTION value="3" >article1</OPTION>
<OPTION value="4" >article1</OPTION>
<OPTION value="5" >article1</OPTION>
</select></td>

du fait qu'un client pourra choisir plusieurs articles, je me demande s'il y a possibilité de faire ceci:
si le client a choisi un article parmi les articles proposé, un champ pareil s'ajoute en bas du premier choix afin qu'il puisse rajouter un nouvel article.

une solution pas difficile à mettre en place:
tu mets sur ta page autant de champs comme celui ci que tu as de produits, le premier est visible, les autres sont cachés en css (visibility: hidden ou display: none), et ensuite, tu de débrouiller pour changer ces attributs à l'aide de javascript, par exemple en agissant sur un onchange...
si tu n'y arrives pas, revient avec du code et on verra

oui c'est ce que j'ai fait mais mes clients n'ont pas appreci que la page de commande soit aussi chargé que les champs de la apge, c'est pour ça je me suis penché vers ce forum pour alleger le contenu de la page.

je suis pas connaisseur en javascript mais il y a une fonction qui me permettera peut etre de faire quelque chose c'est "innerhtml" lmais je ne sais pas m'en servir.

merci pour ton interet

Si ta page était aussi chargée de champ, c'est que tu n'as pas utilisé les style display ou visibility pour les masquer comme te le suggérais jojo.

Ceci dit, il y a deux solution pour ajouter dynamiquement des champs à la volée : soit via le innerHTML, soit via le DOM (Document Object Model).

Pour le innerHTML il n'y a rien de compliqué, il s'agit simplement de modifier le contenu html d'un élément en l'écrasant ou en le complétant comme une variable javascript :

Code : Tout sélectionner

<div id="monElement">Elément 1</div>

<input type="button" value="Cliquer ici" onClick="document.getElementById('monElement').innerHTML+='<br>Elément 2';" />

ta solution est impécable mais je veux bien ajouter un "select" et non un objet ou text comme t'as mis sur ton code, comment je dois faire stp??

merci

j'ai essayé de remplacer élement 2 par <select></select> mais ça n'a pas marché!!!

Ca devrait marcher tout pareil .. par contre, il faut faire attention au apostrophes et guillemets qui peuvent poser problème :

Code : Tout sélectionner

<div id="monElement">Elément 1</div> 
<input type="button" value="Cliquer ici" onClick="document.getElementById('monElement').innerHTML+='<br><select name=\'toto\'><option value=\'1\'>Elément 1</option></select>';" />

Il vaut mieux à mon avis utiliser une fonction, c'est plus simple et plus lisible :

Code : Tout sélectionner

<div id="monElement">Elément 1</div> 
<input type="button" value="Cliquer ici" onClick="addSelect();" />

<script language="javascript">
function addSelect() {

  var str='';
  str+='<br>';
  str+='<select name="toto">';
  str+='<option value="1">Elément 1</option>';
  str+='</select>';

  document.getElementById('monElement').innerHTML+= str;
}
</script>

Ca devrait marcher tout pareil .. par contre, il faut faire attention au apostrophes et guillemets qui peuvent poser problème :

Code : Tout sélectionner
<div id="monElement">Elément 1</div> <input type="button" value="Cliquer ici" onClick="document.getElementById('monElement').innerHTML+='<br><select name=\'toto\'><option value=\'1\'>Elément 1</option></select>';" />
Il vaut mieux à mon avis utiliser une fonction, c'est plus simple et plus lisible :

Code : Tout sélectionner
<div id="monElement">Elément 1</div> <input type="button" value="Cliquer ici" onClick="addSelect();" /> <script language="javascript"> function addSelect() { var str=''; str+='<br>'; str+='<select name="toto">'; str+='<option value="1">Elément 1</option>'; str+='</select>'; document.getElementById('monElement').innerHTML+= str; } </script>

c'est ce que je chaerchais ceci est très clair et c'est meme hyper clair pour un null comme moi.
je peux te demander un autre truc et la je criois c'est trop compliqué pour moi pour le faire moi meme:
sur le prmeir select on va supposer qu'il y a 10 choix, si je fais un choix et je clique sur le bouton, est ce que je peux avoir le 2ème select avec 9 articles seulement (cad moins celui déjà choisi)

Merci infiniment,

Ca devrait marcher tout pareil .. par contre, il faut faire attention au apostrophes et guillemets qui peuvent poser problème :

Code : Tout sélectionner
<div id="monElement">Elément 1</div> <input type="button" value="Cliquer ici" onClick="document.getElementById('monElement').innerHTML+='<br><select name=\'toto\'><option value=\'1\'>Elément 1</option></select>';" />
Il vaut mieux à mon avis utiliser une fonction, c'est plus simple et plus lisible :

Code : Tout sélectionner
<div id="monElement">Elément 1</div> <input type="button" value="Cliquer ici" onClick="addSelect();" /> <script language="javascript"> function addSelect() { var str=''; str+='<br>'; str+='<select name="toto">'; str+='<option value="1">Elément 1</option>'; str+='</select>'; document.getElementById('monElement').innerHTML+= str; } </script>

peux tu m'aider stp????!!!!

Forum d'entraide PHPFrance

insertion automatique d’un champ select dans une page html

insertion automatique d’un champ select dans une page html