Создание многомерного массива Javascript из значений входных данных - PullRequest
0 голосов
/ 25 июня 2018

Я работаю с некоторым количеством числовых полей в таблице. Таблица содержит Имя элемента, Цена за единицу и Номер, который является Количество. Каждое время Количество увеличивается или уменьшается. Я хочу массив продуктов / элементов, который будет содержать item name, item unit price, item Amount, total price of that item.

Например, вот так

items = 
 [
    ['Name', '5', '2', '10'],
    ['Name2', '15', '2', '30'],
 ]

Если сумма равна zero, тогда этот элемент не будет размещен в массиве.

jQuery(document).ready(function() {
  jQuery(document).on('input', '.se-ticket-qty', function() {
    var items = GetItems();

    // jQuery('input#items').val(items);
    console.log(items);
  });

  function GetItems() {
    jQuery(".se-ticket-qty").each(function(index) {
      var items = [];
      var item_name = jQuery(this).data('name');
      var unit_price = parseFloat(jQuery(this).data('unit-price'));
      var amount = parseFloat(jQuery(this).val());
      var totalPrice = unit_price * amount;

      items = [item_name, unit_price, amount, totalPrice];
    });
    return items;
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <th>Front Row</th>
    <td><span class="se-curency">$ </span>5</td>
    <td>
      <input min="0" data-name="Front Row" data-unit-price="5" class="se-ticket-qty" type="number" value="0" />
    </td>
  </tr>
  <tr>
    <th>VIP Seat</th>
    <td><span class="se-curency">$ </span>10</td>
    <td>
      <input min="0" data-name="VIP Seat" data-unit-price="10" class="se-ticket-qty" type="number" value="0" />
    </td>
  </tr>
</table>

1 Ответ

0 голосов
/ 25 июня 2018

Вы переназначаете items на новый массив

  1. Инициализируйте массив вне каждого блока
  2. Используйте метод .push() для заполнения нового массива Элемент
  3. Используйте camelCase т.е. unitPrice для штриховых ключей при использовании метода .data().
  4. Добавьте оператор условия для ноль

Код

function GetItems() {
  var items = []; //Initialize 
  jQuery(".se-ticket-qty").each(function(index) {
    var item_name = jQuery(this).data('name');
    var unit_price = parseFloat(jQuery(this).data('unitPrice'));
    var amount = parseFloat(jQuery(this).val());
    //Add condtion for zero
    if (amount > 0) { 
      var totalPrice = unit_price * amount;
      items.push([item_name, unit_price, amount, totalPrice]); //Use push
    }
  });
  return items;
}

jQuery(document).on('input', '.se-ticket-qty', function() {
  var items = GetItems();

  console.clear();
  console.log(items);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <th>Front Row</th>
    <td><span class="se-curency">$ </span>5</td>
    <td>
      <input min="0" data-name="Front Row" data-unit-price="5" class="se-ticket-qty" type="number" value="0" />
    </td>
  </tr>
  <tr>
    <th>VIP Seat</th>
    <td><span class="se-curency">$ </span>10</td>
    <td>
      <input min="0" data-name="VIP Seat" data-unit-price="10" class="se-ticket-qty" type="number" value="0" />
    </td>
  </tr>
</table>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...