Problème ajout de noeud (duplication dynamique de ligne)

Bonjour à tous,

Voilà, j'ai un petit (gros) souci
Je vous explique tout ça...

J'ai un formulaire qui me permet de saisir un nom, prénom et fonction par liste déroulante pour une personne.
Or, il se peut qu'en fonction de l'ajout en question, on ai besoin d'ajouter 1 ou x personne.
Donc plutôt que de créer 20 lignes vides (et qui le resteront pour la plupart), je voudrais rajouter dynamiquement mes lignes (et donc les supprimer).
Ces dernières sont contenues dans les balises <p></p> et par défaut au 1er chargement de la page j'obtiens ça :


En cliquant sur le "+", j'obtiens bien ceci :


Par contre, j'ai plusieurs problèmes :
1- je voudrais bien avoir qu'un seul "lien" pour créer une nouvelle ligne et non un bouton "+" sur chaque ligne même, mais je n'y arrive pas.
2- lorsque je veux supprimer une ligne, déjà ça ne fonctionne pas sous FF, mais uniquement sous IE, et en plus ça me supprime la dernière ligne ajoutée et non celle que je désire.
3- Enfin, si je remplis ma 1ere ligne par exemple et que j'en ajoute une nouvelle, elle est bien créée, mais avec le contenu de la ligne supérieure et moi je souhaiterais qu'elle soit vide...

Pour information, je me suis servis et inspiré du post suivant :
http://forum.alsacreations.com/topic-5-11931-1-Ajouter-supprimer-un-noeud-dans-un-formulaire.html[/url]

ET sinon voici mon code personnel :
HTML/PHP :

<p class="distribution_reference" name="A_dupliquer">
<label for="nomPersonne" class="distribution-lbl"><?php echo $sLang_Lbl_NomPersonne; ?></label>						
<input type="text" id="nomPersonne" name="nomPersonne[]" maxlength="255" value="" class="saisie_distribution" />
											
<label for="prenomPersonne" class="distribution-lbl"><?php echo $sLang_Lbl_PrenomPersonne; ?></label>						
<input type="text" id="prenomPersonne" name="prenomPersonne[]" maxlength="255" value="" class="saisie_distribution" />						
<label for="fctPersonne" class="distribution-lbl"><?php echo $sLang_Lbl_FonctionPersonne; ?></label>
<select id="fctPersonne" name="fctPersonne[]" class="saisie_liste_distribution">
<option value=""><?php echo $sLang_Lbl_NonRenseigne; ?></option>
<?php
//On va compléter la liste avec les valeurs de la BDD
//On appelle la fonction nécessaire
$aFonctions = listeFonctions();
							
//On remplit la liste déroulante
foreach($aFonctions as $sCle => $sValeur){
//
echo "<option value=\"".$aFonctions[$sCle]["id"]."\">";
echo $aFonctions[$sCle]["nom"];
echo "</option>\n";
}
?>													
</select>
						
<a href="#" class="distribution-choix" title="<?php echo $sLang_A_Title_ChoisirPersonne; ?>"><?php echo $sLang_Lbl_Bouton_ChoisirPersonne; ?></a>

<a href="#" class="distribution-suppLigne" title="<?php echo $sLang_A_Title_SuppressionLigne; ?>" onclick="suppParagraphe(this); return false;"><img src="<?php echo $sRacineSite.PATH_IMAGES_APPLI; ?>/boutons/supprimer-ligne.gif" /></a>	
					
<a href="#" class="distribution-ajtLigne" title="<?php echo $sLang_A_Title_AjouterLigne; ?>" onclick="ajtParagraphe(this); return false;"><img src="<?php echo $sRacineSite.PATH_IMAGES_APPLI; ?>/boutons/ajouter-ligne.png" /></a>
						
</p>

Code javascript :

/**
 * Fonction qui va permettre d'innitialiser la duplication de la ligne
 *
 * @access public
 */
function dparagrapheInit() {
	var lesParagraphes = document.getElementsByTagName('P');
	j=0;
	for ( var i = 0; j < lesParagraphes.length; j++ ) {
		if (lesParagraphes[j].className == 'distribution_reference') {
			var leParagraphe = lesParagraphes[j];
			var newLigne = leParagraphe.cloneNode(true);
		}
	}
}

/**
 * Fonction qui va permettre de dupliquer une partie d'un formulaire<br />
 * à partir de l'élément souhaité en retrouvant le "parentTagName" de "element".
 * @access public
 */
function getParent(element, parentTagName) {
	if ( ! element )
		return null;
	else if ( element.nodeType == 1 && element.tagName.toLowerCase() == parentTagName.toLowerCase() )
		return element;
	else
		return getParent(element.parentNode, parentTagName);
}

/**
 * Fonction qui va permettre de rajouter une ligne
 *
 * @access public
 */
function ajtParagraphe(link) {
	//On définit la variable
	var p = getParent(link,'P');
	
	//On récupère le paragraphe à dupliquer
	var newLigne = p.cloneNode(true);
	p.appendChild(newLigne);
}

/**
 * Fonction qui va permettre de supprimer une ligne
 *
 * @access public
 */
function suppParagraphe(link) {
	var p = getParent(link,'P');
	//On récupère le paragraphe à dupliquer
	var newLigne = p.removeNode(true);
	p.appendChild(newLigne);
}

Voilà, c'est long mais je suis bien coincé, alors si quelqu'un pouvait m'aider ou m'éclairer.
Merci d'avance à vous.

Pour ton problème de ligne non vide, tu peux vider les champs après ajout de la nouvelle ligne, en fixant leur valeur à une chaîne vide pour leur propriété value.

Oui, je n'avais pas pensé à ça.

En revanche, je n'arrive toujours pas supprimer la ligne que je souhaite (c'est toujours la dernière ajoutée qui est supprimée).
Et je n'arrive toujours pas non plus à n'avoir qu'un suel lien pour créer une nouvelle ligne.

Donc je suis toujours preneur...

Sinon merci pour le conseil pour vider les cellules (c'est toujours au plus simple que l'on ne pense pas... ).

Pour supprimer la ligne de ton choix, tu peux utiliser le tableau childNodes en conjonction avec removeChild.

Si tes lignes sont toutes pareilles, tu peux cloner toujours la première.