Pb affichage ajout champ dans tableau php/js

Fermé
moogly_praha Messages postés 73 Date d'inscription lundi 22 octobre 2007 Statut Membre Dernière intervention 13 septembre 2010 - 9 nov. 2007 à 14:08
moogly_praha Messages postés 73 Date d'inscription lundi 22 octobre 2007 Statut Membre Dernière intervention 13 septembre 2010 - 12 nov. 2007 à 14:23
Bonjour,

bon je ne trouve pas la solution de mon probleme c'est pourquoi je m'adresse à vous qui connaissait surement la réponse.

Je souhaiterais créer un formualire avec 3 champs l'un à côté de l'autre possédant les noms de champs (titre) au dessus de chaque champ. pour cela j'ai créer un tableau. Jusque la ca marche.

Ensuite j'ai eu l'idée de placer un bouton dans une quatrieme colonne qui perme d'ajouter 3 champs en dessous des autres. Sans faire de tableau ca marche.

Mon probleme est le suivant : Lorsque je met le tout dans un tableau et que je clique sur "Ajouter" les Champ se mettent à la place du bouton ... Comment faire pour qu'ils apparaissent sous les 3 autres champs dans le tableau créer ?

Voici mon code :


	<script language=javascript> 
function create_champ(i){
var i2 = i + 1;
    document.getElementById('input_'+i).innerHTML = '<div id="champs_'+i+'"><tr><td>'+i+'</td><td><input type="text" name="titre1_'+i+'" size="25" onClick="javacript:transpo('+i+')" /></td><td><input name="titre2_'+i+'" type="text" size="25"/></td><td><input name="titre3_'+i+'" type="text" size="25" readonly value="" /></td><td><input type="button" value="X" onClick="javascript:supr_champ('+i+')"></td></tr></div>';
    document.getElementById('input_'+i).innerHTML += (i <= 100) ? '<span id="input_'+i2+'"><input class="input2" type="button" onClick="javascript:create_champ('+i2+')" value="Ajouter"></span>' : ''; 
    document.getElementById('titre1_'+i).value = document.getElementById('titre2_'+(i-1)).value;
    document.getElementById('nombre').value = i;
}

function supr_champ(i)
{
  var Parent;
  var Obj = document.getElementById ( 'input_'+i) ;
 
  if( Obj)
    Parent = Obj.parentNode;     
    if( Parent)
     Obj.removeChild(Obj.childNodes[0]);

}

function transpo(i) {
    document.getElementById('titre1_'+i).value = document.getElementById('titre2_'+(i-1)).value;
}	  

	</script>
</head>

<body>
<div class="tableau">
  	<div class="entete">
   	<p>
    		<span class="titre1">titre 1 :</span>
    		<span class="titre2">titre 2 :</span>
    		<span class="titre3">titre 3 :</span>
    		<span class="action">Action</span>
   	</p>
  	</div>
  	<div class="corps">
   	<form method="get" action="modifier.php">
    	<p>
		<span class="titre1"><input type="text" name="titre1" value="" size=25 /></span>
     		<span class="titre2"><input type="text" name="titre2" value="" size=25 /></span>
     		<span class="titre3"><input type="text" name="titre3" readonly value="" size=25 /></span>
	</p>
	<div id="champs_1"></div>
        	<span id="input_2" class="action"><input name="button" type="button" class="input2" onClick="javascript:create_champ(2)" value="Ajouter"></span>
   	</form>

   	<span class="clear"></span>
  	</div>
</div>




Merci pour votre aide

1 réponse

moogly_praha Messages postés 73 Date d'inscription lundi 22 octobre 2007 Statut Membre Dernière intervention 13 septembre 2010 5
12 nov. 2007 à 14:23
personne n'a une petite idée de comment régler ce probleme ???
0