Javascript-форум - Как добавить в конец таблицы несколько записей?

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Как добавить в конец таблицы несколько записей? (https://javascript.ru/forum/misc/82686-kak-dobavit-v-konec-tablicy-neskolko-zapisejj.html)

Как добавить в конец таблицы несколько записей?

Здравствуйте. Мой php заполняет мне таблицу вот таким образом:

<tbody>
<? foreach ($order as $o): ?>
  <tr>
    <input type="hidden" value="<?= $o['_id'] ?>" class="sysid">
    <td class="id"><?= $o['number'] ?></td>
    <td>
      <p class="bold"><?= $o['name_person'] ?></p>
      <p class="cont"><?= $o['mailphone_person'] ?></p>
    </td>
    <td><?= $o['adress_person'] ?></td>
    <td>
      <? foreach ($o['products'] as $p): ?>
        <p><?= $p ?></p>
      <? endforeach; ?>
    </td>
    <td><?= $o['price'] ?> ₽</td>
    <td>
      
      <select name="status" class="opti">
      <? foreach ($options as $op): ?>
        <option value="<?= $op ?>" <? if ($op == $o['status']): ?> selected <? endif; ?> ><?= $op ?></option>
      <? endforeach; ?>
      </select>
    </td>
  </tr>
<? endforeach; ?>
</tbody>

Дальше я хочу сделать подзагрузку следующих полей. Как мне на js реализовать генерацию таблицы?

Я начала с вот такого:

let table = document.querySelector('tbody');
let insrow = table.insertRow(-1);
let inscell = insrow.insertCell(-1);

Но у меня ощущение, что я делаю что-то не то. Нет варианта проще, чтобы также как в php сделать? Чтобы просто собираешь одну строку, а он дальше по образу и подобию генерирует дальше

nastya97core,
два цикла insertRow и insertCell обычно так

nastya97core,
можно цикл по массиву данных

рони,
А нет возможности сразу собрать html каркас, чтобы как в php?
я имею в виду вот так:

<? foreach ($order as $o): ?>
  <tr>
    <input type="hidden" value="<?= $o['_id'] ?>" class="sysid">
...

Чтобы я туда просто переменные вставила

nastya97core,
так foreach по массиву данных

Цитата:

Сообщение от nastya97core

чтобы как в php?

Если бы у бабушки был бы член - то она была бы дедушкой. ;)

ПХП серверный язык и это не JavaScript.

Как вариант, ты можешь в той таблице добавить еще один tbody (в ПХП) с одной пустой строкой... Скрыть его.
При получении данных клонировать ту строку из скрытого tbody... Заполнять ее данными и вставлять в видимый tbody.

Цитата:

Сообщение от nastya97core

Нет варианта проще, чтобы также как в php сделать? Чтобы просто собираешь одну строку, а он дальше по образу и подобию генерирует дальше

Можно через template.
Как то так

const tmp = document.createElement('template')

let s = ''
// Тут заполняем строку HTML кодом
// например в цикле
for (let i = 0; i<nr; i++) {
   s+='<tr>';
   // заполняем ячейки
       s+='<td>....</td>';
       s+='<td>....</td>';
       s+='<td>....</td>';
   s+='</tr>';
}
tmp.innerHTML = s;
let tbody = document.querySelector('tbody');
tbody.appendChild(tmp.content)

Для вставки переменных вместо строк '...' используйте `${}`

Цитата:

Сообщение от nastya97core (Сообщение 537917)

рони,
А нет возможности сразу собрать html каркас, чтобы как в php?
я имею в виду вот так:

<? foreach ($order as $o): ?>
  <tr>
    <input type="hidden" value="<?= $o['_id'] ?>" class="sysid">
...

Чтобы я туда просто переменные вставила

[[1,2,3],[4,5,6],[7,8,9]].map(tr=>`<tr>${tr.map(td=>`<td>${td}</td>`).join('')}</tr>`).join('')