Выбор вывода при переборе двух массивов

Question

Поэтому, когда я перебираю два моих массива (ассоциативных) в js и добавляю вывод в мою таблицу, я получаю 3 undefined.Вывод выглядит так: Вывод

В консоли видно, что итерация происходит последовательно, поэтому я получаю неопределенные значения, учитывая природу массива

Это вызов jQuery для моего контроллера, где я получаю оба моих массива:

function getArtworks() {
  $.ajax({
    type: 'GET',
    url: './index.php/Controller/getArtworks',
    dataType: 'json',
    success: function (jsonData) {
      showArtsInTable(jsonData);
      console.log(jsonData);
    },
    error: function () {
      alert('Error :' + jsonData);
    }
  });
}

Здесь я перебираю свои массивы и добавляю в свою таблицу:

function showArtsInTable(jsonData) {
  let table = $('#tblArt');
  $('#artForm').hide();
  table.empty();
  table.append('<thead>');
  table.append('<tr>');
  table.append('<th>Namn</th>');
  table.append('</tr>');
  table.append('</thead>');
  $.each(jsonData, function() {
    $.each(this, function(i, value) {
      console.log(value);
      table.append('<tbody>');
      table.append('<tr>');
      table.append(
        "<td><a href='#' onclick=getArtworkByID('" +
          value['ID'] +
          "')>" +
          value['NAME'] +
          '</a></td>'
      );
      table.append('</tr>');
      table.append('</tbody>');
      table.append('<tr>');
      table.append('<td>' + value['MAX(BID)'] + '</td>');
      table.append('</tr>');
    });
  });
}

stringified consolelog:

[
    {
      "ID": "1",
      "NAME": "Chaviour",
      "CATID": ""
    },
    {
      "ID": "2",
      "NAME": "simpleDrop",
      "CATID": ""
    },
    {
      "ID": "3",
      "NAME": "Chattash",
      "CATID": "Janne"
    },
],
[
    {
      "ID": "1",
      "DATE": "2019-03-16 19:39:06",
      "MAX(BID)": "7500"
    },
    {
      "ID": "2",
      "DATE": "2019-03-16 19:39:06",
      "MAX(BID)": "5000"
    },
    {
      "ID": "3",
      "DATE": "2019-03-16 20:55:48",
      "MAX(BID)": "9000"
    }
]

Я хочу, чтобы моя таблица добавляла значения только под столбцами «Имя» и «Ставка».Как я могу это сделать?

Answer 1

Я думаю, я понимаю, что вы после.

Просто чтобы проверить, вы хотите следующий вывод?

Имя | Организатор торгов

Chaviour | 7500

simpleDrop | 5000

Chattash | 9000

Вам необходимо сначала объединить свои данные по ID:

const data = [
     [
        {
          "ID": "1",
          "NAME": "Chaviour",
          "CATID": ""
        },
        {
          "ID": "2",
          "NAME": "simpleDrop",
          "CATID": ""
        },
        {
          "ID": "3",
          "NAME": "Chattash",
          "CATID": "Janne"
        },
    ],
    [
        {
          "ID": "1",
          "DATE": "2019-03-16 19:39:06",
          "MAX(BID)": "7500"
        },
        {
          "ID": "2",
          "DATE": "2019-03-16 19:39:06",
          "MAX(BID)": "5000"
        },
        {
          "ID": "3",
          "DATE": "2019-03-16 20:55:48",
          "MAX(BID)": "9000"
        }
    ]
]

const tidyData = data[0].map((a) => {
  // find the matching item by ID
  let match = data[1].find((b) => b.ID === a.ID) || {}
  // return the union
  return {
    ...a,
    ...match,
  }
})

console.log(tidyData);

Это возвращает следующие данные, отсюда должно быть довольно легко показать в таблице:

[
    {
        "ID": "1",
        "NAME": "Chaviour",
        "CATID": "",
        "DATE": "2019-03-16 19:39:06",
        "MAX(BID)": "7500"
    },
    {
        "ID": "2",
        "NAME": "simpleDrop",
        "CATID": "",
        "DATE": "2019-03-16 19:39:06",
        "MAX(BID)": "5000"
    },
    {
        "ID": "3",
        "NAME": "Chattash",
        "CATID": "Janne",
        "DATE": "2019-03-16 20:55:48",
        "MAX(BID)": "9000"
    }
]