Problème bouton d'ajout de ligne de saisie(input) dans formulaire

Nouveau WRInaute
Bonjour à tous,

Voila j'ai un souci avec un bouton qui est censé ajouter des lignes de saisies. Cependant, je pense que le code marche (en effet le bouton marche dans une page html vierge), donc je pense que c'est une erreur de placement dans mes différentes pages, mais j'ai tout essayer et je trouve pas la solution.
Je m'explique pour être plus clair: en fait j'ai une page ajouter.php qui contient une fonction "detail_noeud" et qui appelle la page form_ajax.php qui me permet de renseigner dans une input text un nombre qui répétera un formulaire le nombre de fois saisi, juste qu'ici j'ai pas de problème mais mon bouton qui doit insérer les lignes de saisies ne fonctionnent pas :-(.

PAGE AJOUTER:
Code:
<head><script>
function detail_noeud(str){
	if (str==""){
		  document.getElementById("cluster_nb_noeud").innerHTML="";
		  return;
	} 
	if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
		  xmlhttp=new XMLHttpRequest();
	}
	else {// code for IE6, IE5
		  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}
	xmlhttp.onreadystatechange=function(){
	  if (xmlhttp.readyState==4 && xmlhttp.status==200){
		    document.getElementById("detail_noeud").innerHTML=xmlhttp.responseText;
	  }
	}
	xmlhttp.open("GET","form_ajax.php?f=detail_noeud&v="+str,true);
	xmlhttp.send();
}
</script>
</head>

<div id="detail_noeud"></div>


Voila le code qui pose problème form_ajax.php:

Code:
if ($fonction == "detail_noeud" && is_numeric($_GET["v"]) && $_GET["v"] != 0){
	$nb_noeuds = $_GET["v"];                                
	$i = 1;
	while ($i <= $nb_noeuds){                              //répète le tableau ci dessous le nombre de fois qui à etait saisi
?>

<p align=left><H3><b><u>Cartes Add-On dans le Produit</u></b></H3></p>
<H5>Si le nombre de cartes est différent, prendre le nombre le plus grand</H5>
<table border="1">
   <tr><td colspan="2" align=center><h3>Tete <?=$i?></h3></td></tr>
	<tr>	
		<td align=center>Cartes Add_on</td>	
	</tr>
  <tr>
		<td><input type=text name=nom_addon <?=$i?> size=30></td>
	</tr>
</table>

 <script>
var nlignes = 1;
function Ajouter(){
nlignes++;
saisies.insertAdjacentHTML('BeforeEnd','<BR>Produit '+nlignes+' <input type=text size=4 name=P'+nlignes+'> Quantité '+nlignes+' <input type=text name=QT'+nlignes+'> et de trois '+nlignes+' <input type=text name=QT'+nlignes+'>');
};
</script>
 \\bouton qui s'affiche mais qui ajoute pas les lignes de saisies alors que dans une page vierge il fonctionne tres bien
<Form> 
<Input Type="Button" Value="Ajouter une ligne" OnClick=Ajouter()>
<br>
<Div ID="saisies"> Produit 1 <input type="text" size=4 name="P1"> Quantité 1 <input type="text" name="QT1"> et de trois 1<input type="text" name="QT1"></Div>
</Form>

<?php
		$i++;
?>
<?php
	}
}
?>


Si il y a quelqu'un pour m'aider, merci d'avance , en esperant que j'ai était assez clair
 
Nouveau WRInaute
Est ce le fait que le bouton "ajouter des lignes de saisi" est dans un "while", si cela pose un problème ? ou si les méthodes d'envoi dans la page même ou entre les deux pages ne sont pas bonnes je sais pas??? merci
 
WRInaute accro
Comme ça, sans tester en live c'est difficile de t'aider.
Je ne peux que te conseiller d'analyser ça avec Firebug, le "ça ne marche pas" sera surement plus verbeux ;)
 
WRInaute accro
je suis pas du tout certain que du code javascript chargé via une requête ajax puisse s'exécuter (j'ai déjà eu le souci). La solution est de charger le javascript utile avec la page et de n'utiliser les chargements ajax que pour le html.
Sinon tu peux aussi prévoir un script qui ajoutera dynamiquent d'autre scripts JS mais cela doit se faire depuis le document d'origine.
 
Nouveau WRInaute
ok merci a tous et oui zeb on m'a dit aussi que c'était cela mais je sais pas comment faire , je vais réessayer et si vous avez des idées n'hésitez pas merci bcp
 
WRInaute accro
Bah sans regarder ton code en détail, sur l'action qui charge a l'aide d'ajax la partie html pure tu ajoute un script du genre :
Code:
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'http://www.example.com/script/my-script.js';
document.getElementsByTagName('head')[0].appendChild(script);
Mais note bien que c'est pas logique ni normal de devoir charger du code JS dynamiquement. Ou du moins ça devrait être assez rare sur un système bien pensé au départ. Il n'est en effet pas logique de ne pas disposer de ton JS au chargement premier de la page.
 
Nouveau WRInaute
Voila ça marche !!! merci beaucoup !! en effet, il fallait mettre le script fonction dans la page d'origine , la div "<Div ID="saisies"> Produit 1 <input type="text" size=4 name="P1"> Quantité 1 <input type="text" name="QT1"> et de trois 1<input type="text" name="QT1"></Div>" dans la page ajouter et laisser le bouton dans la page form_ajax :)
merci
 
Nouveau WRInaute
Bonjour a tous,

j'ai un autre petit souci, sur ce même script, mon bouton marche mais étant dans un while il se répète le nombre de fois saisi, c'est normal. Mais comment faire pour que les différents bouton ne soit pas dépendant l'un de l'autre? car en effet, que j'appuie sur un bouton ou un autre il m'ajoute mes lignes l'une au dessous de l'autre, alors que je voudrais que chacun ajoute ses propres lignes.
 
WRInaute accro
il faut associer des ID uniques dans tes objets html et faire en sorte que le javascript agisse que sur l'objet html qui porte cet ID
 
Nouveau WRInaute
ok il a sa div id mais ce sera le meme pour tous les boutons, tu va me dire c'est normal. je comprend pas au faite, il faudrait faire des if?
 
WRInaute accro
itry a dit:
ok il a sa div id mais ce sera le même pour tous les boutons,
Normalement (norme html) il ne dois jamais y avoir deux ID identiques (par définition) Dans ton cas vue que tu as une boucle genre while de mémoire tu peux concaténer un indice à l'ID que tu incrémenterait a chaque tour

genre :
PHP:
<span class="syntaxdefault">var indice </span><span class="syntaxkeyword">=</span><span class="syntaxdefault"> 1</span><span class="syntaxkeyword">;<br />while(</span><span class="syntaxdefault">condition</span><span class="syntaxkeyword">){<br /></span><span class="syntaxdefault"> code </span><span class="syntaxkeyword">=</span><span class="syntaxdefault"> </span><span class="syntaxstring">'<div id="MonID'</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">+</span><span class="syntaxdefault"> indice </span><span class="syntaxkeyword">+</span><span class="syntaxdefault"> </span><span class="syntaxstring">'">(...)</div>'</span><span class="syntaxkeyword">;<br /></span><span class="syntaxdefault"> indice</span><span class="syntaxkeyword">++;<br />}</span><span class="syntaxdefault"> </span>

il te faudra surement ensuite adapter ton code javascript pour qu'il prenne en compte l'indice dans sa fonction métier.
Tes boutons qui déclenchent tes actions devront donc transmettre l'indice au javascript dans l'appel de fonction.
 
Nouveau WRInaute
Bonjour à tous,

J'essaye d'ajouter à mon code un bouton qui supprime des input type text

Voila mon code:
Code:
<script>
var nlignes = 1;
function Ajouter1(){
nlignes++;
saisies1.insertAdjacentHTML('BeforeEnd','<BR>Produit '+nlignes+' <input type=text size=4 name=P'+nlignes+'> Quantité '+nlignes+' <input type=text name=QT'+nlignes+'> et de trois '+nlignes+' <input type=text name=QT'+nlignes+'>');
};
</script>

<Form>
<Input Type="Button" Value="Ajout ligne" OnClick=Ajouter1()>
<br>
<div id="saisies1"></div>
</Form>


j'ai un bouton ajouter qui rajoute 3 input a chaque clique , je veux faire un bouton qui supprime la ligne de 3 input a chaque clique , mais ça ne fonctionne pas si quelqu'un peut m'aider svp ?

merci d'avance
 
WRInaute accro
PHP:
<span class="syntaxdefault"></span><span class="syntaxkeyword"><</span><span class="syntaxdefault">Input Type</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"Button"</span><span class="syntaxdefault"> Value</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"Supprimer ligne"</span><span class="syntaxdefault"> OnClick</span><span class="syntaxkeyword">=</span><span class="syntaxstring">"document.getElementById('saisies1').innerHTML='';"</span><span class="syntaxdefault"> </span><span class="syntaxkeyword">/></span><span class="syntaxdefault"> </span>
 
Nouveau WRInaute
j'ai utiliser ton code ça marche mais par contre quand il supprime , il se supprime toute les lignes .
par exemple: je clique 3 fois sur mon bouton ajouter , donc il rajoute au total 3 input mais quand je clique sur le bouton supprimer , il supprime les 3 en meme temps , il y aurait pas un moyen pour qu'il supprime un par un?
je pense qu'il faudrait mettre a la places de "saisies1" --> "nlignes" mais j'arrive pas a le réadapter pour qu'il marche.
merci
 
WRInaute accro
Toujours ton histoire d'indice :
PHP:
<span class="syntaxhtml"><span class="syntaxdefault">    </span><span class="syntaxkeyword"><</span><span class="syntaxdefault">script</span><span class="syntaxkeyword">><br /></span><span class="syntaxdefault">    var nlignes </span><span class="syntaxkeyword">=</span><span class="syntaxdefault"> 0</span><span class="syntaxkeyword">;<br /></span><span class="syntaxdefault">    function Ajouter</span><span class="syntaxkeyword">(){<br /></span><span class="syntaxdefault">        nlignes</span><span class="syntaxkeyword">++;<br /></span><span class="syntaxdefault">        var obj </span><span class="syntaxkeyword">=</span><span class="syntaxdefault"> document</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">getElementById</span><span class="syntaxkeyword">(</span><span class="syntaxstring">'saisies'</span><span class="syntaxkeyword">);<br /></span><span class="syntaxdefault">        obj</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">innerHTML </span><span class="syntaxkeyword">=</span><span class="syntaxdefault"> obj</span><span class="syntaxkeyword">.</span><span class="syntaxdefault">innerHTML </span><span class="syntaxkeyword">+</span><span class="syntaxdefault"> </span><span class="syntaxstring">'<div id="champ'</span><span class="syntaxkeyword">+</span><span class="syntaxdefault">nlignes</span><span class="syntaxkeyword">+</span><span class="syntaxstring">'">Produit '</span><span class="syntaxkeyword">+</span><span class="syntaxdefault">nlignes</span><span class="syntaxkeyword">+</span><span class="syntaxstring">' <input type="text" size="4" name="P'</span><span class="syntaxkeyword">+</span><span class="syntaxdefault">nlignes</span><span class="syntaxkeyword">+</span><span class="syntaxstring">'" /> Quantité '</span><span class="syntaxkeyword">+</span><span class="syntaxdefault">nlignes</span><span class="syntaxkeyword">+</span><span class="syntaxstring">' <input type="text" name="QT'</span><span class="syntaxkeyword">+</span><span class="syntaxdefault">nlignes</span><span class="syntaxkeyword">+</span><span class="syntaxstring">'" /> et de trois '</span><span class="syntaxkeyword">+</span><span class="syntaxdefault">nlignes</span><span class="syntaxkeyword">+</span><span class="syntaxstring">' <input type="text" name="QT'</span><span class="syntaxkeyword">+</span><span class="syntaxdefault">nlignes</span><span class="syntaxkeyword">+</span><span class="syntaxstring">'" /> <input type="button" value="supprimer" onclick="document.getElementById(\'champ'</span><span class="syntaxkeyword">+</span><span class="syntaxdefault">nlignes</span><span class="syntaxkeyword">+</span><span class="syntaxstring">'\').innerHTML=\'\';" /></div>'</span><span class="syntaxkeyword">;<br /></span><span class="syntaxdefault">    </span><span class="syntaxkeyword">}<br /></span><span class="syntaxdefault">    </script><br /></span><br />    <Form><br />    <Input Type="Button" Value="Ajout ligne" OnClick="Ajouter();"><br />    <br><br />    <div id="saisies"></div><br />    </Form></span>
 
Discussions similaires
Haut