Создать многомерный массив с динамической формой jquery

Question

У меня есть следующая форма, и я динамически добавляю больше выпадающих меню (точно так же, как они), если пользователь нажимает на ссылку, чтобы добавить больше элементов

<div class="dynamic-sale">
      <select name="sizes[]" id="sizes" class="entry-dropdown">
        <option value="3XL">3XL</option>
        <option value="2XL">2XL</option>
        <option value="XL">XL</option>
        <option value="L">L</option>
        <option value="M">M</option>
        <option value="YL">YL</option>
        <option value="YM">YM</option>
      </select> 
   <select name="number[]" id="amount" class="entry-dropdown">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
   </select>
   <select name="price[]" id="price" class="entry-dropdown">
        <option value="15">$15</option>
        <option value="12.5">$12.5</option>
        <option value="10">$10</option>
        <option value="0">Free</option>
   </select>
 </div>

У меня такой вопрос, я хочу взять результаты и получить их в формате, в котором я могу все сложить.

так что он скажет, сколько размеров у меня есть, сколько у каждого размера и цена. Я предполагаю, что мне нужен многомерный массив.

У меня сейчас есть:

 $('#order-submit').click(function(){

var size = [];
var price = [];
var quantity = []; 

$.each($('.entry-dropdown'), function() {

    size.push($(this).val());


});
  console.log(size);

Но все это дало мне один массив: ["XL", "3", "15", "3XL", "1", "15"] (когда я это проверял)

Как лучше всего получить эти данные в пригодном для использования формате?

Надеюсь, это имеет смысл! Спасибо

Answer 1

Это немного по-другому, но что-то вроде этого может быть идеей:

var data = [];

$("#order-submit").click(function () {
    $(".dynamic-sale").each(function () {
        var $saleDiv = $(this);
        data.push({
            size: $saleDiv.children(".size-dropdown").val(),
            amount: window.parseInt($saleDiv.children(".amount-dropdown").val(), 10),
            price: window.parseFloat($saleDiv.children(".price-dropdown").val())
        });    
    });
});

В результате вы получите Array из Object с, каждый из которых представляет строку в таблице,как:

[
    {size: "3XL", amount: 1, price: 0},
    {size: "M", amount: 7, price: 12.5}
    ...
]

Answer 2

Вы должны пройти через каждый элемент dynamic-sale. Затем выполните цикл по дочерним элементам и добавьте значения в подмассив.

var result = [];                               // <-- Main array
$(".dynamic-sale").each(function(){
    var individual_result = [];                // <-- "sub"-array
    $(this).find("select").each(function(){
        individual_result.push($(this).val());
    })
    result.push(individual_result);            // <-- Add "sub" array to results
});

Этот метод возвращает массив, состоящий из массива с size, price and quantity.

Если вы хотите поместить эти значения в отдельный массив, используйте:

var size = [],
    price = [],
    quantity = [];
$(".dynamic-sale").each(function(){
    var selects = $(this).find("select");
    size.push(selects.eq(0).val());
    price.push(selects.eq(1).val());
    quantity.push(selects.eq(2).val());
});