Кнопка для удаления строки таблицы не работает с использованием Javascript - PullRequest
Новая
       9

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

0 голосов
/ 02 октября 2019

Это таблица, в которой я использовал кнопку для удаления таблицы. 

    <table>
            <tr>
                <th>First Name</th>
                <th>Middle Name</th>
                <th>Last Name</th>
                <th>User Name</th>
                <th>Email</th>
                <th>Remove</th>

            </tr>

                <tr>
                    <td>Sujan6</td>
                    <td>Bikram5</td>
                    <td>Thapa</td>
                    <td>Sujan6</td>
                    <td>Sujan@gmail5</td>
                    <td><button class="button button3"><a href="/Home/StudentList/54">Remove</a></button></td>
                </tr>
<tr>
            <td>Sujan7</td>
            <td>Bikram6</td>
            <td>Thapa</td>
            <td>Sujan7</td>
            <td>Sujan@gmail5</td>
            <td><button class="button button3"><a href="/Home/StudentList/55">Remove</a></button></td>
        </tr>
    </table>

Это код Javascript, с помощью которого я пытаюсь удалить строку таблицы. Этот код показывает ошибку:

"Ошибка типа: невозможно прочитать свойство 'parentNode' из неопределенного" в строке "var tr = td.target.parentElement;" 

var deleteRecord = document.getElementsByClassName('button button3');
for (var i = 0; i < deleteRecord.length; i++) {
    deleteRecord[i].addEventListener('click', removeItem);

}
function removeItem(e) {
    event.preventDefault();
    if (confirm('Are You Sure')) {
        var td = e.target.parentElement;
        var tr = td.target.parentElement;
        tr.parentElement.removeChild('tr');
    }
}

1 Ответ

0 голосов
/ 02 октября 2019

td не является событием, поэтому у него нет цели. Доступ к этому вызовет ошибку, которую вы видите. Получите доступ к parentElement напрямую по td.

. При удалении элемента также необходимо удалить кавычки вокруг tr. 

function removeItem(e) {
    event.preventDefault();
    if (confirm('Are You Sure')) {
        var td = e.target.parentElement;
        var tr = td.parentElement;
        tr.parentElement.removeChild(tr);
    }
}
...