zibinsky
@zibinsky

Как добавить новую запись в таблицу?

В качестве практики делаю товарищу программку по учету его трудовых показателей.
Смысл в чем: по клику на кнопку "Создать новую запись" вываливается окно с инпутами и кнопкой "Создать".
После заполнения инпутов и нажатия кнопки "Создать" должна создаваться новая строчка с готовыми данными и отображаться на странице.
Я пытаюсь это сделать с помощью шаблонной строки. Но не срабатывает схема.
Помогите, подскажите, где что не так?

https://codepen.io/jurij-zibinskij/pen/rNMwYGM
  • Вопрос задан
  • 79 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега JavaScript
Обработчик события submit должен висеть на форме, а не кнопке.
Корневой элемент добавляемой записи (<div class="table">) - лишний.
После добавления новой записи окно с формой наверное надо бы убрать.

modalWindowForm.addEventListener('submit', function(e) {
  e.preventDefault();

  const newNote = `
    <div class="table-line line">
      здесь без изменений, элементы .table-line__item оставляете как есть
    </div>
  `;

  table.innerHTML += newNote;
  // или
  // table.insertAdjacentHTML('beforeend', newNote);

  modalWindow.classList.remove('active');
});
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Artezio Нижний Новгород
от 130 000 до 180 000 ₽
Artezio Москва
от 160 000 до 220 000 ₽
Intspirit Краснодар
от 80 000 до 150 000 ₽
23 янв. 2021, в 17:51
150000 руб./за проект
23 янв. 2021, в 17:34
10000 руб./за проект
23 янв. 2021, в 17:31
500 руб./за проект