Werte von Feldern in einem Objekt speichern

Question

Momentan habe ich eine Liste von Auswahlfeldern mit Eingängen und möchte die Werte in einem Objekt speichern, wenn das Formular gesendet wird, etwa so? Wie könnte ich das tun?

var commissions = { 
    seller:"Agent", 
    percentage:"50" 
}, 
{ 
    seller:"Crisalix Global", 
    percentage:"20" 
}, 
{ 
    seller:"Support", 
    percentage:"30" 
}; 

Dies ist der HTML:

<div class="container-seller-commission"> 
    <div class="row-seller-commission"> 
    <select name="seller" id="seller" class="select-seller valid"> 
     <option value=""></option> 
     <option value="4" selected="selected">Agent</option> 
     <option value="2">Crisalix Global</option> 
     <option value="1">Owner</option> 
     <option value="3">Support</option> 
    </select> 
<input name="percentage" id="percentage" value="100" class="sales-form-input--number sales-form-input--commission valid" type="number"> 
    </div> 
</div> 
<div class="row-seller-commission"> 
    <select name="seller" id="seller" class="select-seller valid"> 
    <option value=""></option> 
    <option value="4" disabled="disabled">Agent</option> 
    <option value="2" selected="selected">Crisalix Global</option> 
    <option value="1">Owner</option> 
    <option value="3">Support</option> 
    </select> 
<input name="percentage" id="percentage" value="100" class="sales-form-input--number sales-form-input--commission valid" type="number"> 
</div> 
<div class="row-seller-commission"> 
    <select name="seller" id="seller" class="select-seller valid"> 
    <option value=""></option> 
    <option value="4" disabled="disabled">Agent</option> 
    <option value="2">Crisalix Global</option> 
    <option value="1" selected="selected">Owner</option> 
    <option value="3" disabled="disabled">Support</option> 
    </select> 
<input name="percentage" id="percentage" value="100" class="sales-form-input--number sales-form-input--commission valid" type="number"> 
</div> 

Answer 1

Zu allererst Ihre HTML definitiv ungültig ist. Keine zwei Elemente sollten die gleiche ID in einer HTML-Seite teilen. Es entspricht nicht den Standards. Sie müssen etwas anderes verwenden, z. HTML5-Attribute, CSS-Klassen usw. für solchen Code.

kommend auf die Lösung für Ihr Problem, kann es ähnlich getan werden, um die folgende (unter der Annahme, dass eine Schaltfläche, um die Liste der Details erzeugt):

$("#submit").click(function() { 
    var commissions = []; 

    $(".row-seller-commission").each(function() { 
    var seller = $(this).find("select[name=seller] option:selected").text(), 
     percentage = $(this).find("input[name=percentage]").val(); 

    commissions.push({ 
     seller: seller, 
     percentage: percentage 
    }); 
    }); 

    console.log(commissions); 
}); 

commissions das Ergebnis enthalten wird, nach Ihrem Bedarf.