Création automatique d'un button
iheb1985
-
adns Messages postés 1152 Statut Membre -
adns Messages postés 1152 Statut Membre -
Bonjour,
j'essayai de créer automatiquemnt un button lors du click sur un autre button déjà existant mais ça n'a pas marché
voici le code
<html>
<head>
<script language="javascript">
function ajout()
{
new_but = document.createElement("input");
element_input.parentNode.appendChild(new_but);
new_but.setAttribute("type", "submit");
new_but.setAttribute("id", "choix");
new_but.setAttribute("name", "choix2");
new_but.setAttribute("value", "ok");
}
</script>
</head>
<body>
<div align="center">
<input type="submit" onClick="ajout();">
</div>
</body>
</html>
j'essayai de créer automatiquemnt un button lors du click sur un autre button déjà existant mais ça n'a pas marché
voici le code
<html>
<head>
<script language="javascript">
function ajout()
{
new_but = document.createElement("input");
element_input.parentNode.appendChild(new_but);
new_but.setAttribute("type", "submit");
new_but.setAttribute("id", "choix");
new_but.setAttribute("name", "choix2");
new_but.setAttribute("value", "ok");
}
</script>
</head>
<body>
<div align="center">
<input type="submit" onClick="ajout();">
</div>
</body>
</html>
A voir également:
- Création automatique d'un button
- Réponse automatique thunderbird - Guide
- Logiciel de sauvegarde automatique gratuit - Guide
- Recherche automatique des chaînes ne fonctionne pas - Guide
- Creation compte gmail - Guide
- Création site web - Guide
3 réponses
Bonjour
voila j'ai légèrement modifié ton code
Adns
voila j'ai légèrement modifié ton code
<html>
<head>
<script language="javascript">
function ajout()
{
new_but = document.createElement("input");
//element_input.parentNode.appendChild(new_but);
new_but.setAttribute("type", "submit");
new_but.setAttribute("id", "choix");
new_but.setAttribute("name", "choix2");
new_but.setAttribute("value", "ok");
var myctn = document.getElementById('container');
var mynewdiv = myctn.insertBefore(new_but,myctn.firstChild);
}
</script>
</head>
<body>
<div align="center">
<input type="button" value="ajout" onClick="ajout();">
</div>
<div id="container" align="center">
</div>
</body>
</html>
Adns
Merci bien pour les réponses,
J'ai essayer d'améliorer mon code en ajoutant des select ,une est fixe représentant la catégorie des chansons et une qui se crée automatiquement selon la catégorie choisie,j'ai essayer de créer un bouton d'envoi après le choix de l'artiste(à partir de la deuxième select).Mon problème maintenant et que le bouton reste lorsque je change de catégorie et par la suite j'obtient deux bouton alors que ce n'est pas logique.J'essayai de supprimer le bouton lors du changement de la catégorie avec la fonction "removechild",est ce quelqu'un peut m'aider.Merci et voici le code sur le quel je travaille:
<html>
<html>
<head>
<script language="javascript">
list_choix = {
"Rai" : ["Cheb khaled", "Cheb Hasni", "Cheb Mami"],
"Tounsi" : ["Saber", "Latifa", "Amina"],
"Mesri" : ["Hani Chaker", "Tamer Hosni"],
"Chami" : ["Wael Jassar", "Nancy"],
"Gharbi" : ["Akon", "Enrique Eglesias", "Madonna"],
}
function addButton()
{
var f1 = document.getElementById("categorie");
var button = document.createElement("input");
button.type="submit";
button.value="envoyer";
categorie.appendChild(button);
}
function ajout(selection)
{
nb_select = selection.parentNode.getElementsByTagName("select").length;
if ( selection == selection.parentNode.getElementsByTagName("select") [nb_select-1] ) {
element_select = selection;
selection = selection.options[selection.selectedIndex].value;
if ( list_choix[selection] ) {
new_liste = document.createElement("select");
element_select.parentNode.appendChild(new_liste);
new_liste.setAttribute("id", "choix2");
new_liste.setAttribute("name", "choix2");
new_liste.setAttribute("onchange", "ajout(this)");
new_liste.setAttribute("onchange","addButton()");
for (var i=0; i<list_choix[selection].length; i++) {
new_option = document.createElement("option");
new_liste.appendChild(new_option);
new_option.setAttribute("value", list_choix[selection][i]);
new_option.text = list_choix[selection][i];
}
}
}
else {
selection.parentNode.removeChild(selection.nextSibling);
ajout(selection)
}
}
</script>
</head>
<body>
<div align="center">
<form name="categorie" action="recuperer.php">
<select name="choix1" id="choix1" onChange="ajout(this)">
<option value="0">-------</option>
<option value="Rai">Rai</option>
<option value="Tounsi">Tounsi</option>
<option value="Mesri">Mesri</option>
<option value="Chami">Chami</option>
<option value="Gharbi">Gharbi</option>
</select>
<div> </div>
</form>
</div>
</body>
</html>
J'ai essayer d'améliorer mon code en ajoutant des select ,une est fixe représentant la catégorie des chansons et une qui se crée automatiquement selon la catégorie choisie,j'ai essayer de créer un bouton d'envoi après le choix de l'artiste(à partir de la deuxième select).Mon problème maintenant et que le bouton reste lorsque je change de catégorie et par la suite j'obtient deux bouton alors que ce n'est pas logique.J'essayai de supprimer le bouton lors du changement de la catégorie avec la fonction "removechild",est ce quelqu'un peut m'aider.Merci et voici le code sur le quel je travaille:
<html>
<html>
<head>
<script language="javascript">
list_choix = {
"Rai" : ["Cheb khaled", "Cheb Hasni", "Cheb Mami"],
"Tounsi" : ["Saber", "Latifa", "Amina"],
"Mesri" : ["Hani Chaker", "Tamer Hosni"],
"Chami" : ["Wael Jassar", "Nancy"],
"Gharbi" : ["Akon", "Enrique Eglesias", "Madonna"],
}
function addButton()
{
var f1 = document.getElementById("categorie");
var button = document.createElement("input");
button.type="submit";
button.value="envoyer";
categorie.appendChild(button);
}
function ajout(selection)
{
nb_select = selection.parentNode.getElementsByTagName("select").length;
if ( selection == selection.parentNode.getElementsByTagName("select") [nb_select-1] ) {
element_select = selection;
selection = selection.options[selection.selectedIndex].value;
if ( list_choix[selection] ) {
new_liste = document.createElement("select");
element_select.parentNode.appendChild(new_liste);
new_liste.setAttribute("id", "choix2");
new_liste.setAttribute("name", "choix2");
new_liste.setAttribute("onchange", "ajout(this)");
new_liste.setAttribute("onchange","addButton()");
for (var i=0; i<list_choix[selection].length; i++) {
new_option = document.createElement("option");
new_liste.appendChild(new_option);
new_option.setAttribute("value", list_choix[selection][i]);
new_option.text = list_choix[selection][i];
}
}
}
else {
selection.parentNode.removeChild(selection.nextSibling);
ajout(selection)
}
}
</script>
</head>
<body>
<div align="center">
<form name="categorie" action="recuperer.php">
<select name="choix1" id="choix1" onChange="ajout(this)">
<option value="0">-------</option>
<option value="Rai">Rai</option>
<option value="Tounsi">Tounsi</option>
<option value="Mesri">Mesri</option>
<option value="Chami">Chami</option>
<option value="Gharbi">Gharbi</option>
</select>
<div> </div>
</form>
</div>
</body>
</html>
Reuh !!
Modifications apportées au code :
- Ajout de choix "vide" pour obligé un onchange
- suppression du bouton si changement du premier select
- Compatible IE6
Bon courage
Adns
Modifications apportées au code :
- Ajout de choix "vide" pour obligé un onchange
- suppression du bouton si changement du premier select
- Compatible IE6
<html>
<html>
<head>
<script language="javascript">
list_choix = {
"Rai" : ["-------","Cheb khaled", "Cheb Hasni", "Cheb Mami"],
"Tounsi" : ["-------","Saber", "Latifa", "Amina"],
"Mesri" : ["-------","Hani Chaker", "Tamer Hosni"],
"Chami" : ["-------","Wael Jassar", "Nancy"],
"Gharbi" : ["-------","Akon", "Enrique Eglesias", "Madonna"]
}
function addButton()
{
var f1 = document.getElementById("categorie");
var button = document.createElement("input");
button.type="submit";
button.id = "plop";
button.value="envoyer";
categorie.appendChild(button);
}
function ajout(selection)
{
if (document.getElementById("plop"))
categorie.removeChild(document.getElementById("plop"));
nb_select = selection.parentNode.getElementsByTagName("select").length;
if ( selection == selection.parentNode.getElementsByTagName("select") [nb_select-1] ) {
element_select = selection;
selection = selection.options[selection.selectedIndex].value;
if ( list_choix[selection] ) {
new_liste = document.createElement("select");
element_select.parentNode.appendChild(new_liste);
new_liste.id="choix2";
new_liste.name="choix2";
//new_liste.setAttribute("onchange", "ajout(this)");
new_liste.onchange=function(){addButton()}
for (var i=0; i<list_choix[selection].length; i++) {
new_option = document.createElement("option");
new_liste.appendChild(new_option);
new_option.setAttribute("value", list_choix[selection][i]);
new_option.text = list_choix[selection][i];
}
}
}
else {
selection.parentNode.removeChild(selection.nextSibling);
ajout(selection)
}
}
</script>
</head>
<body>
<div align="center">
<form name="categorie" action="recuperer.php">
<select name="choix1" id="choix1" onChange="ajout(this)">
<option value="0">-------</option>
<option value="Rai">Rai</option>
<option value="Tounsi">Tounsi</option>
<option value="Mesri">Mesri</option>
<option value="Chami">Chami</option>
<option value="Gharbi">Gharbi</option>
</select>
<div> </div>
</form>
</div>
</body>
</html>
Bon courage
Adns
