Formulaire, lignes illimitées

Salut tout le monde

J'ai donc le formulaire ci-dessous :

<form action="" method="post" name="inscriptions">
<fieldset>
<legend>Inscrivez-vous</legend>
<table style="width: 95%; margin: auto;">
<tr>
<th>Nom</th>
<th>Prénom</th>
<th>N° Licence</th>
<th>Catégorie</th>
<th>Arc</th>
</tr>
<tr>
<td><input type="text" size="10" name="nom_1" /></td>
<td><input type="text" size="10" name="prenom_1" /></td>
<td><input type="text" size="10" name="licence_1" /></td>
<td><input type="text" size="10" name="categorie_1" /></td>
<td><input type="text" size="10" name="arc_1" /></td>
</tr>
<tr>
<td><input type="text" size="10" name="nom_2" /></td>
<td><input type="text" size="10" name="prenom_2" /></td>
<td><input type="text" size="10" name="licence_2" /></td>
<td><input type="text" size="10" name="categorie_2" /></td>
<td><input type="text" size="10" name="arc_2" /></td>
</tr>
</table>
<br />
<input type="submit" name="submit" value="Envoyer" />
</fieldset>
</form>

Ce que j'aimerais faire c'est que pour chaque clic sur un lien "Ajouter", une nouvelle ligne s'ajoute à la suite dans le tableau.
Un peu comme ici mais il ne s'agit pas d'un tableau.

Par exemple pour un nouveau clic, j'aurais :

<form action="" method="post" name="inscriptions">
<fieldset>
<legend>Inscrivez-vous</legend>
<table style="width: 95%; margin: auto;">
<tr>
<th>Nom</th>
<th>Prénom</th>
<th>N° Licence</th>
<th>Catégorie</th>
<th>Arc</th>
</tr>

<tr>
<td><input type="text" size="10" name="nom_1" /></td>
<td><input type="text" size="10" name="prenom_1" /></td>
<td><input type="text" size="10" name="licence_1" /></td>
<td><input type="text" size="10" name="categorie_1" /></td>
<td><input type="text" size="10" name="arc_1" /></td>
</tr>
<tr>
<td><input type="text" size="10" name="nom_2" /></td>
<td><input type="text" size="10" name="prenom_2" /></td>
<td><input type="text" size="10" name="licence_2" /></td>
<td><input type="text" size="10" name="categorie_2" /></td>
<td><input type="text" size="10" name="arc_2" /></td>
</tr>
<tr>
<td><input type="text" size="10" name="nom_3" /></td>
<td><input type="text" size="10" name="prenom_3" /></td>
<td><input type="text" size="10" name="licence_3" /></td>
<td><input type="text" size="10" name="categorie_3" /></td>
<td><input type="text" size="10" name="arc_3" /></td>
</tr>
</table>
<br />
<input type="submit" name="submit" value="Envoyer" />
</fieldset>
</form>

De même, un lien "Retirer" permettrait d'enlever la dernière ligne.

Pouvez-vous me donner des pistes s'il vous plaît ?
Merci d'avance

Edit

J'ai réussi à modifié le script du lien donné plus haut pour qu'il réponde à mes attentes.
Ca fonctionne quasiment parfaitement en local mais quand je suis passé sur Free, j'ai la console Javascript de Firefox qui m'indique

Erreur : d.createElement is not a function
Fichier source : http://lesarchersgorziens.free.fr/includes/add.js
Ligne : 21

Donc voilà quel est le problème avec Free ?

/***********************************************************************
Script permettant d'ajouter ou de supprimer diverses entrées de fichiers à la volée
koala64 - 13/04/2006 | Modifié par T@kniX 20/05/06
***********************************************************************/

var d = document;
var OB = new Object();

OB = {
Init: function()
{
OB.Rozy.Boutons();
}
};

window.onload = OB.Init;

OB.Rozy = {
Boutons: function()
{
var contliens = d.createElement( 'p' );

var ajout = d.createElement( 'a' );
ajout.setAttribute( 'href' , '#corps' );
ajout.setAttribute( 'id' , 'Ajout' );

var textajout = d.createTextNode( '' );
textajout.data = 'Ajouter un archer';

var separateur = d.createTextNode( '' );
separateur.data = ' | ';

var retrait = d.createElement( 'a' );
retrait.setAttribute( 'href' , '#' );
retrait.setAttribute( 'id' , 'Retrait' );

var textretrait = d.createTextNode( '' );
textretrait.data = 'Retirer un archer';

var fieldset = d.getElementById( 'fieldset' );
var p = fieldset.getElementsByTagName( 'table' )[0];

fieldset.insertBefore( contliens , p );
contliens.appendChild( ajout );
ajout.appendChild( textajout );
contliens.appendChild( separateur );
contliens.appendChild( retrait );
retrait.appendChild( textretrait );

ajout.onclick = OB.Rozy.AjoutChamp;
retrait.onclick = OB.Rozy.RetraitChamp;
},
AjoutChamp: function()
{
var fieldset = d.getElementById( 'table' );
var nombre_de_paragraphe = fieldset.getElementsByTagName( 'tr' ).length-1;

if( nombre_de_paragraphe >= 10 )
window.alert( 'Vous ne pouvez pas créer plus de 10 champs...' );
else
{
var numero_dapres = nombre_de_paragraphe + 1;

var ligne = d.createElement( 'tr' );

var cellule_1 = d.createElement( 'td' );
var champ_1 = d.createElement( 'input' );
champ_1.setAttribute( 'type' , 'text' );
champ_1.setAttribute( 'size' , '10' );
champ_1.setAttribute( 'name' , 'nom_' + numero_dapres );

var cellule_2 = d.createElement( 'td' );
var champ_2 = d.createElement( 'input' );
champ_2.setAttribute( 'type' , 'text' );
champ_2.setAttribute( 'size' , '10' );
champ_2.setAttribute( 'name' , 'prenom_' + numero_dapres );

var cellule_3 = d.createElement( 'td' );
var champ_3 = d.createElement( 'input' );
champ_3.setAttribute( 'type' , 'text' );
champ_3.setAttribute( 'size' , '10' );
champ_3.setAttribute( 'name' , 'licence_' + numero_dapres );

var cellule_4 = d.createElement( 'td' );
var champ_4 = d.createElement( 'input' );
champ_4.setAttribute( 'type' , 'text' );
champ_4.setAttribute( 'size' , '10' );
champ_4.setAttribute( 'name' , 'categorie_' + numero_dapres );

var cellule_5 = d.createElement( 'td' );
var champ_5 = d.createElement( 'input' );
champ_5.setAttribute( 'type' , 'text' );
champ_5.setAttribute( 'size' , '10' );
champ_5.setAttribute( 'name' , 'arc_' + numero_dapres );

fieldset.appendChild( ligne );
ligne.appendChild( cellule_1 );
cellule_1.appendChild( champ_1 );
ligne.appendChild( cellule_2 );
cellule_2.appendChild( champ_2 );
ligne.appendChild( cellule_3 );
cellule_3.appendChild( champ_3 );
ligne.appendChild( cellule_4 );
cellule_4.appendChild( champ_4 );
ligne.appendChild( cellule_5 );
cellule_5.appendChild( champ_5 );
}
},
RetraitChamp: function()
{
var fieldset = d.getElementById( 'table' );
var nombre_de_paragraphe = fieldset.getElementsByTagName( 'tr' ).length-1;

if( nombre_de_paragraphe == 1 )
window.alert( 'Un champ minimum obligatoire...' );
else
fieldset.removeChild( fieldset.lastChild );
}
};

Encore merci par avance.

Ajouter/enlever une ligne avec un lien

Formulaire, lignes illimitées

Supprimer

Modérer

Signaler le message aux modérateurs