0

Есть таблица в которую строки добавляются по нажатию кнопки. Мне нужно получать доступ к ячейкам таблицы, после того как поле было добавлено. Может быть добавлено любое количество полей. Я пытался получить доступ через rows[i].cells, но у меня ничего не вышло.

    const addElement = document.getElementById('addField');

addElement.addEventListener('click', addField);

const rows = document.querySelector('table').rows;

console.log(rows[0].cells); 

function addField() {
    const form = document.querySelector('table');

    let newField = document.createElement('input');
    let newTr = document.createElement('tr');
    let newTd = document.createElement('td');
    let contenteditable = document.createElement('td');

    newField.setAttribute('type', 'text');
    newField.setAttribute('name', 'expenditure[]');
    newField.setAttribute('value', 0);

    contenteditable.setAttribute("contenteditable", true);
    //contenteditable.setAttribute("class", 'form-control');//class="form-control"
    contenteditable.innerHTML = "Поле для ввода данных";

    const pos = form.childElementCount;
    newTd.appendChild(newField);
    newTr.appendChild(contenteditable);
    newTr.appendChild(newTd);


    form.insertBefore(newTr, form.childNodes[pos]);
    return form;
}
1
  • Что ты ожидаешь увидеть в консоли ДО ТОГО, как кликнули и добавили строки в таблицу? 3 ноя 2021 в 10:56

1 ответ 1

0

Событие ещё не произошло, а вы пытаетесь что-то посмотреть. Надо это делать после совершённого события. Как вариант сделать несколько функций (одна добавляет данные, другая ещё что-то делает) и поместить их в одну общую, которая будет отрабатывать при клике

let addField = () => {
    //...
};

let showData = () => {
    const rows = document.querySelector('table').rows;
    console.log(rows[0].cells); 
};

let aggregateFunction = () => {
    addField();
    showData();
};

addElement.addEventListener('click', aggregateFunction);

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.