Ajout de champ de texte sur clic
Résolu/Fermé
A voir également:
- Ajout de champ de texte sur clic
- Excel cellule couleur si condition texte - Guide
- Transcription audio en texte word gratuit - Guide
- Ajout rapide snap - Forum Snapchat
- Convertisseur récupération de texte - Guide
- Texte annonce hôtesse de l'air décollage ✓ - Forum Réseaux sociaux
3 réponses
merci de votre aide j'ai pu trouver le bon script qui permet de faire d'ajouter un champ de txt en cliquant sur un bouton ou un lien :
<script type="text/javascript">
var i=0;
function addSelect(){
i++;
// On récupère l'endroit où devra être ajouté la liste
var divCible = document.getElementById("divCible");
// On récupère la liste modèle
var selModele = document.getElementById("cadre");
// On la clone dans une nouvelle variable
var nvxSel = selModele.cloneNode(true);
// (pour la présentation, on crée un retour à la ligne)
var br = document.createElement("<br>");
// On adapte les attributs de la nouvelle liste : nom, id et affichage
nvxSel.name = "cadre"+i;
nvxSel.id = "cadre"+i;
// On ajoute tout ça à l'emplacement voulu
Ajouter();
nvxSel.value='';
divCible.appendChild(nvxSel);
divCible.appendChild(br);
}
var nlignes = 1;
function Ajouter(){
nlignes++;
divCible.insertAdjacentHTML('BeforeEnd','');
/*divCible.innerHTML='<strong> <br>Patente'+nlignes+' :</strong>';*/
return nlignes;
}
</script>
il suffit de mettre ce code entre les balises <head></head>
ou le définir sur un document.js et l'appeler par
<script language="JavaScript" src="document.js"></script>
et enfin appeler sur cette fonction comme suit en ajoutant dans le formulaire:
<div id="divCible"><input type="text" name="des_act" id="des_act" >
<a href="javascript:addSelect();" >ajouter</a>
</div>
<script type="text/javascript">
var i=0;
function addSelect(){
i++;
// On récupère l'endroit où devra être ajouté la liste
var divCible = document.getElementById("divCible");
// On récupère la liste modèle
var selModele = document.getElementById("cadre");
// On la clone dans une nouvelle variable
var nvxSel = selModele.cloneNode(true);
// (pour la présentation, on crée un retour à la ligne)
var br = document.createElement("<br>");
// On adapte les attributs de la nouvelle liste : nom, id et affichage
nvxSel.name = "cadre"+i;
nvxSel.id = "cadre"+i;
// On ajoute tout ça à l'emplacement voulu
Ajouter();
nvxSel.value='';
divCible.appendChild(nvxSel);
divCible.appendChild(br);
}
var nlignes = 1;
function Ajouter(){
nlignes++;
divCible.insertAdjacentHTML('BeforeEnd','');
/*divCible.innerHTML='<strong> <br>Patente'+nlignes+' :</strong>';*/
return nlignes;
}
</script>
il suffit de mettre ce code entre les balises <head></head>
ou le définir sur un document.js et l'appeler par
<script language="JavaScript" src="document.js"></script>
et enfin appeler sur cette fonction comme suit en ajoutant dans le formulaire:
<div id="divCible"><input type="text" name="des_act" id="des_act" >
<a href="javascript:addSelect();" >ajouter</a>
</div>
Dacobah
Messages postés
260
Date d'inscription
samedi 26 novembre 2005
Statut
Membre
Dernière intervention
28 septembre 2011
74
18 avril 2008 à 19:12
18 avril 2008 à 19:12
Bon, peut-être que tu pourrais essayer ça dans ce cas :
A placer entre tes balises <head> et </head>
Et à placer dans ton formulaire :
Après il te reste à automatiser ce bout de code s'il fonctionne bien.
A placer entre tes balises <head> et </head>
<script type="text/javascript">
function AjoutChamp(nom)
{
document.getElementById('champs').innerHTML += '<input type="text" name='+nom+' />';
}
</script>
Et à placer dans ton formulaire :
<div id="champs"> <input type="text" name="pseudo" /> <a href="#" onclick="AjoutChamp(nom);">Cliquer ici pour ajouter un champ</a> <a href="#" onclick="AjoutChamp(prenom);">Cliquer ici pour ajouter un champ</a> </div>
Après il te reste à automatiser ce bout de code s'il fonctionne bien.
je viens d'essayer avec ce code là, mais ça marche pas ,
d'abord je sai pa pourkoi (href="#") ne marche pas car il m'envoie dans une autre page vide
donc je l'ai remplacé par <a href="javascript:AjoutChamp(nom);"> mais ça ossi ne marche pas ça m'indique "erreur sur la page" au niveau de la barre d'état
d'abord je sai pa pourkoi (href="#") ne marche pas car il m'envoie dans une autre page vide
donc je l'ai remplacé par <a href="javascript:AjoutChamp(nom);"> mais ça ossi ne marche pas ça m'indique "erreur sur la page" au niveau de la barre d'état
foufita
Messages postés
68
Date d'inscription
mercredi 29 août 2007
Statut
Membre
Dernière intervention
10 mars 2014
8
18 avril 2008 à 16:16
18 avril 2008 à 16:16
la solution est un bout du code java script :
<script>
function ajout_champ ()
{
document.write("<input type='text'/>");
}
</script>
<html>
<body>
<input name="" type="button" value="ajouter" onClick="ajout_champ ();">
</body>
</html>
<script>
function ajout_champ ()
{
document.write("<input type='text'/>");
}
</script>
<html>
<body>
<input name="" type="button" value="ajouter" onClick="ajout_champ ();">
</body>
</html>
slt foufita, merci de m'avoir répondu,
en fait j'ai essayé avec ce code là mais ça n'a pa marché car en cliquant sur le bouton ajouter ça renvois vers une nouvelle page, en plus comment identifier chaque champ ajouté , cad comment recupere les données dans les pages suivantes
et merci encore une fois
en fait j'ai essayé avec ce code là mais ça n'a pa marché car en cliquant sur le bouton ajouter ça renvois vers une nouvelle page, en plus comment identifier chaque champ ajouté , cad comment recupere les données dans les pages suivantes
et merci encore une fois