Récupération des champs d'un formulaire dynamique

Bonjour à tous,

Je vous expose mon problème en essayant d'etre le plus claire possible :

Je travaille actuellement sur un site de vente en ligne et mon problème survient lors de la consultation du panier.
En gros voici un exemple de code retourné par php :

<form id="form" name="panier">
						<div id="un" class="listeproduits l"> 
							<img src="images/produit.jpg" alt="exemple produit" /> 
							<div class="apropos s"> 
								<h2>Serpent et echelle mag.</h2> 
								<p>Colisage : <strong>48 par boite.</strong></p> 
							</div> 
							<div style="display: block; position: relative; float: left; margin: 10px 0 0 0;"> 
								<input name="quantityUBON03830" type="text" style="width: 50px;" value="1" onchange="remplissage();"/> 
							</div> 
							<input style="display: block; position: relative; float: left; margin: 10px;" value="0" name="prixUBON03830">$</p> 
							<input style="display: block; position: relative; float: left; margin: 10px; font-weight: bold" value="0" name="subtotalUBON03830">$</p> 
							<div style="display: block; position: relative; float: right; margin: 10px 20px 0 0;"> 
								<input type="checkbox" /> 
							</div> 
							<span class="clear"></span> 
						</div> 
						<input type="hidden" value="UBON03830" name="id">

						<div id="un" class="listeproduits l"> 
							<img src="images/produit.jpg" alt="exemple produit" /> 
							<div class="apropos s"> 
								<h2>Puzzle cube 15 mcx. safari</h2> 
								<p>Colisage : <strong>24 par boite.</strong></p> 
							</div> 
							<div style="display: block; position: relative; float: left; margin: 10px 0 0 0;"> 
								<input name="quantityPIKO04230" type="text" style="width: 50px;" value="1" onchange="remplissage();"
/> 
							</div> 
							<input style="display: block; position: relative; float: left; margin: 10px;" value="0" name="prixPIKO04230">$</p> 
							<input style="display: block; position: relative; float: left; margin: 10px; font-weight: bold" value="0" name="subtotalPIKO04230">$</p> 
							<div style="display: block; position: relative; float: right; margin: 10px 20px 0 0;"> 
								<input type="checkbox" /> 
							</div> 
							<span class="clear"></span> 
						</div> 
						<input type="hidden" value="PIKO04230" name="id">
[...]



</form>

Voici donc la description de mon problème :

En prennant un exemple concret, je souhaite via JS récuperer et manipuler les valeurs de chaque champs.
Par exemple lorsque l'on change la quantité :

        function remplissage(){
           
            var id = document.panier.id.value;
            var total = (document.panier.quantity+id.value * document.panier.prix+id.value);
            document.panier.subtotal+id.value = total;
var total2 = '';
for(i=0;i<nbChampsSubtotal;i++)                                                                                    // calculer les subtotaux de chaque produits
{
total2 += document.panier.subtotal+id.value;                                                                
}

            document.getElementById('resultat').innerHTML = total;                                           //champs en bas de page qui fait les resultat de chaque subtotal
        }

Bien sur le script ci-dessus ne marche pas à cause de la concatenation pour recuperer le nom de chaque champs, mais je pense que vous avez compris l'idée...

Je suis ouvert à toutes critiques / propositions

Merci de votre aide

Merci bien pour ton aide,

Pour ceux que ca interesserai, j'ai opté pour la 2ème solution en incrementant une variable a chaque champs:

        function remplissage(){
            var nbchampstexteparproduit = 5;
            var prix = '';
            var qte = '';
            var total = new Number();
           
            for ( var n=0; n< document.panier.elements.length; n++ ){
                                if(document.panier.elements[n].name=="q"+(n/nbchampstexteparproduit)){
                                qte = document.panier.elements[n].value;
                                }
                                if(document.panier.elements[n].name=="p"+((n-1)/nbchampstexteparproduit)){
                                    //alert('fuck!!'+n);
                                prix = document.panier.elements[n].value;
                                document.getElementById('stt'+(n-1)/nbchampstexteparproduit).value = qte*prix;
                                document.getElementById('stt'+(n-1)/nbchampstexteparproduit).innerHTML = document.getElementById('stt'+(n-1)/nbchampstexteparproduit).value;
                               
                                total += qte*prix;
                                document.panier.elements[n+1].value = qte*prix;

                                //document.getElementById('stt'+(n-1)/nbchampstexteparproduit)).innerHTML = qte*prix;

                                }
                               
                                //document.getElementById("st"+(n-2)/nbchampstexteparproduit)).value = qte * prix;
                   
            }
            document.getElementById('resultat').innerHTML = total;
        }

et dans PHP apres le POST:

                            $arrid = array();
                            foreach($_POST as $key=>$value){
                                if($_POST[$key] == 'on'){
                                    $arrid[] .= substr($key, -1);
                                }
                            }
                            $arrproduits =array();
                            foreach($arrid as $k=>$v){
                                $arrproduits[] .= $_POST['id'.$v];
                            }


                            foreach($arrproduits as $k=>$v){
                                echo "vous avez acheté les produits".$v."<br>";
                            }

Ca fait un peu barbar la recupération des elements comme ca, mais comme mon nombre de champs est fixe, ca marche et tant mieu :)

Au plaisir !