jQuery get two different values from dynamic table

25 Views Asked by At

I managed to get the first values of the dynamic table. But the code needs to get the element(values) from the table column that is clicked and edited.

//this is dynamic table
//UPDATED
$(receipts).each(function (index, item) {
        console.log(item);
        //console.log(receipts[index]);
        $('#receipts tbody').append(`<tr style="color: black;" class="trReceipts">
        <td>${item.nazivAlata}</td>
        <td oninput="timerInsert(this)" contenteditable="true" class="alKol">${item.kolicina}</td>
        <td  hidden class="idVoz">${item.idVozila}</td></tr>`)

});
//this is timer that is triggering the saveData function when value is changed in item.kolicina column
//UPDATED
function timerInsert(element){   
  
  let $element = $(element), tId = $element.data("timer"); clearTimeout(tId);   
  tId= setTimeout(function() { saveData($element) }, 1500); 
  $element.data('timer', tId);

}

//this is saveData here I need code to get the values of edited column ID and KOLICINA but the ones that are in the selected edited column/row
//UPDATE code changed to solved answer by @mplungjan
function saveData($element) { 

  const $tr = $element.closest('tr');   
  let $kol = $tr.find('.alKol'); 
  let $idVoz = $tr.find('.idVoz');
  console.log($kol.text()); 
  console.log($idVoz.text());

}

On the image below, I edited the second row "Kolicina" column, and the alert after that showed the value from the first row instead of second "Kolicina" value.

enter image description here

Tried a lot of things, from find closest to :selected but could not make it work.

0

There are 0 best solutions below