Получить строку из таблицы HTML по нажатию кнопки

Question

Итак, у меня есть таблица с кнопкой обновления, и я хочу иметь возможность извлечь столбец из кнопки строки, по которой была нажата кнопка.

Ниже приведен HTML-код для таблицы

<table class="table table-hover" style="width: 99%">
        <thead class="thead-dark" align="center">
            <tr>
                <th>ID</th>
                <th>Trainee Class</th>
                <th>Start Date</th>
                <th>Edit</th>
                <th>Trainees</th>
            </tr>
        </thead>
        <tbody align="center">
            <tr>
                <td class="nr">J001</td>
                <td>Java Stream</td>
                <td>01-April-2018</td>
                <td><button onclick="updateData()">Update</button>
                    <button>Remove</button></td>
                <td><button>View</button></td>
            </tr>
 <table>

Итак, когда я нажимаю обновить, я хочу получить "J001" (первый столбец строки кнопки обновления).

Я попробовал ниже, но ничего не получилось.

function updateData(){
     var $item = $(this).closest("tr")   
                 .find(".nr")    
                 .text();        

     alert($item);      
}

Любая помощь или предложение будут оценены.

Answer 1

Вы должны передать this при вызове функции обновления,

Ваш HTML должен быть,

<table class="table table-hover" style="width: 99%">
        <thead class="thead-dark" align="center">
            <tr>
                <th>ID</th>
                <th>Trainee Class</th>
                <th>Start Date</th>
                <th>Edit</th>
                <th>Trainees</th>
            </tr>
        </thead>
        <tbody align="center">
            <tr>
                <td class="nr">J001</td>
                <td>Java Stream</td>
                <td>01-April-2018</td>
                <td><button onclick="updateData(this)">Update</button>
                    <button>Remove</button></td>
                <td><button>View</button></td>
            </tr>
 <table>

Функция Jquery должна быть,

function updateData(e){
     var $item = $(e).closest("tr")   
                 .find("td:first")    
                 .text(); 
     alert($item);      
}