Ajouter des éléments simpleCart à la forme en tant que valeurs d'entrée

Question

Je dois ajouter les éléments de simpleCart à un formulaire. Je ne trouve pas de fonctions intégrées qui le feront donc j'essaye de créer mon propre script.

Sur la SimpleCart page de commande ajoute les articles comme celui-ci:

<div class="simpleCart_items"> 
    <table> 
    <thead> 
     <tr class="headerRow"> 
     <th class="item-name">Name</th> 
     <th class="item-price">Price</th> 
     <th class="item-size">Size</th> 
     <th class="item-color">Color</th> 
     <th class="item-decrement"></th> 
     <th class="item-quantity">Qty</th> 
     <th class="item-increment"></th> 
     <th class="item-total">SubTotal</th> 
     <th class="item-remove"></th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr class="itemRow row-0 odd" id="cartItem_SCI-1"> 
     <td class="item-name">Deer Shirt</td> 
     <td class="item-price">฿400.00</td> 
     <td class="item-size">Small</td> 
     <td class="item-color">Blue</td> 
     <td class="item-decrement"><a href="javascript:;" class="simpleCart_decrement" rel="noreferrer" data-ss1492271303="1">-</a></td> 
     <td class="item-quantity">2</td> 
     <td class="item-increment"><a href="javascript:;" class="simpleCart_increment" rel="noreferrer" data-ss1492271303="1">+</a></td> 
     <td class="item-total">฿800.00</td> 
     <td class="item-remove"><a href="javascript:;" class="simpleCart_remove" rel="noreferrer" data-ss1492271303="1">Remove</a></td> 
     </tr> 
     <tr class="itemRow row-1 even" id="cartItem_SCI-2"> 
     <td class="item-name">Deer Shirt</td> 
     <td class="item-price">฿400.00</td> 
     <td class="item-size">Medium</td> 
     <td class="item-color">Clay</td> 
     <td class="item-decrement"><a href="javascript:;" class="simpleCart_decrement" rel="noreferrer" data-ss1492271303="1">-</a></td> 
     <td class="item-quantity">1</td> 
     <td class="item-increment"><a href="javascript:;" class="simpleCart_increment" rel="noreferrer" data-ss1492271303="1">+</a></td> 
     <td class="item-total">฿400.00</td> 
     <td class="item-remove"><a href="javascript:;" class="simpleCart_remove" rel="noreferrer" data-ss1492271303="1">Remove</a></td> 
     </tr> 
    </tbody> 
    </table> 
</div> 

Sur cette même page de paiement J'ai un formulaire où le client ajoute leur nom, adresse postale, etc. Je voudrais ajouter chaque l'article ci-dessus comme une entrée à la forme comme ceci:

<input type="hidden" name="Item 1" value="Deer Shirt"> 
... 

il semblait à l'aide de .each jQuery fonctionnerait, mais il ne produit pas le résultat souhaité.

C'est ce que j'ai maintenant:

simpleCart.ready(function() { 

    $('.itemRow').each(function(){ 
    $('form').append('<input type="hidden" name="' + $('.itemRow').attr('id') + '" value="' + $('.item-name').text() + '">'); 
    $('form').append('<input type="hidden" name="' + $('.itemRow').attr('id') + '" value="' + $('.item-color').text() + '">'); 
    }); 

}); 

Sortie prévue:

<input type="hidden" name="cartItem_SCI-1" value="Deer Shirt"> 
<input type="hidden" name="cartItem_SCI-1" value="Blue"> 
<input type="hidden" name="cartItem_SCI-2" value="Deer Shirt"> 
<input type="hidden" name="cartItem_SCI-2" value="Clay"> 

sortie actuelle:

<input type="hidden" name="cartItem_SCI-1" value="NameDeer ShirtDeer Shirt"> 
<input type="hidden" name="cartItem_SCI-1" value="ColorBlueClay"> 
<input type="hidden" name="cartItem_SCI-1" value="NameDeer ShirtDeer Shirt"> 
<input type="hidden" name="cartItem_SCI-1" value="ColorBlueClay"> 

Peut-être .each est pas la meilleure façon. Des idées sur la façon d'obtenir la sortie attendue?

Answer 1

Première erreur est ici

$('.itemRow').each(function(){ 
 
    $('form').append('<input type="hidden" name="' + $(this).attr('id') + '" value="' + $(this).find('.item-name').text() + '">'); 
 
    $('form').append('<input type="hidden" name="' + $(this).attr('id') + '" value="' + $(this).find('.item-color').text() + '">'); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="simpleCart_items"> 
 
    <table> 
 
    <thead> 
 
     <tr class="headerRow"> 
 
     <th class="item-name">Name</th> 
 
     <th class="item-price">Price</th> 
 
     <th class="item-size">Size</th> 
 
     <th class="item-color">Color</th> 
 
     <th class="item-decrement"></th> 
 
     <th class="item-quantity">Qty</th> 
 
     <th class="item-increment"></th> 
 
     <th class="item-total">SubTotal</th> 
 
     <th class="item-remove"></th> 
 
     </tr> 
 
    </thead> 
 
    <tbody> 
 
     <tr class="itemRow row-0 odd" id="cartItem_SCI-1"> 
 
     <td class="item-name">Deer Shirt</td> 
 
     <td class="item-price">฿400.00</td> 
 
     <td class="item-size">Small</td> 
 
     <td class="item-color">Blue</td> 
 
     <td class="item-decrement"><a href="javascript:;" class="simpleCart_decrement" rel="noreferrer" data-ss1492271303="1">-</a></td> 
 
     <td class="item-quantity">2</td> 
 
     <td class="item-increment"><a href="javascript:;" class="simpleCart_increment" rel="noreferrer" data-ss1492271303="1">+</a></td> 
 
     <td class="item-total">฿800.00</td> 
 
     <td class="item-remove"><a href="javascript:;" class="simpleCart_remove" rel="noreferrer" data-ss1492271303="1">Remove</a></td> 
 
     </tr> 
 
     <tr class="itemRow row-1 even" id="cartItem_SCI-2"> 
 
     <td class="item-name">Deer Shirt</td> 
 
     <td class="item-price">฿400.00</td> 
 
     <td class="item-size">Medium</td> 
 
     <td class="item-color">Clay</td> 
 
     <td class="item-decrement"><a href="javascript:;" class="simpleCart_decrement" rel="noreferrer" data-ss1492271303="1">-</a></td> 
 
     <td class="item-quantity">1</td> 
 
     <td class="item-increment"><a href="javascript:;" class="simpleCart_increment" rel="noreferrer" data-ss1492271303="1">+</a></td> 
 
     <td class="item-total">฿400.00</td> 
 
     <td class="item-remove"><a href="javascript:;" class="simpleCart_remove" rel="noreferrer" data-ss1492271303="1">Remove</a></td> 
 
     </tr> 
 
    </tbody> 
 
    </table> 
 
</div> 
 
<form></form>

Et comme pour moi même nom d'entrée cachée pour la couleur et le nom est une erreur

Answer 2

La réponse de Pavlo est correcte par la manière ci-dessus j'ai demandé au question originale mais en raison du commentaire de xDreamCoding j'ai fait quelques recherches et j'ai trouvé que simpleCart avait son propre opérateur .each. En fin de compte, je suis en mesure d'obtenir ce que je dois avec ceci:

simpleCart.each(function(item , x){ 
    $('form').append('<input type="hidden" name="' + item.get('id') + ' Name" value="' + item.get('name') + '">'); 
    $('form').append('<input type="hidden" name="' + item.get('id') + ' Color" value="' + item.get('color') + '">'); 
    });