Как заполнить все значения выше в таблице ниже, как только я нажму кнопку «Добавить»? - PullRequest
0 голосов
/ 20 марта 2020

У меня проблема в том, как заполнить все значения выше в таблице ниже, как только я нажму кнопку «Добавить». Я использую php, jquery и html для ее создания. Кто-нибудь может подсказать мне, как это сделать под картинкой? У меня есть поиск по inte rnet, чтобы найти решение, но не могу найти решение. Ниже изображение клиента, покажи мне, как создать эту таблицу добавления, как показано ниже. Надеюсь, что кто-то может направить меня или дать мне пример, чтобы решить эту проблему. Спасибо.

Output

1 Ответ

1 голос
/ 20 марта 2020

Попробуйте, посмотрите, подходит ли вам:

HTML:

<form role="form">
  <label for="name"></label>
  <input type="text" id="name">
  <label for="age"></label>
  <input type="number" id="age">
  <label for="gender"></label>
  <input type="text" id="gender">
</form>
<table id="table">
  <thead>
    <th>Name</th>
    <th>Age</th>
    <th>Gender</th>
  </thead>
  <tbody>
    <tr>
      <td>Felipe</td>
      <td>29</td>
      <td>M</td>
    </tr>
  </tbody>
</table>

<button id="addButton">Add</button>

JS:

$('#addButton').click(function(){

  var newTableRow = '<tr><td>'+ $('#name').val() +'</td><td>'+ $('#age').val() +'</td><td>'+ $('#gender').val() +'</td></tr>';

  $('#table tr:last').after(newTableRow);  
})

Этот скрипт может быть запущен как Вы нажимаете кнопку, чтобы сохранить данные или после ответа от вашего сервера.

...