You are viewing limited content. For full access, please sign in.

Question

Question

index of current row (and column number)

asked on January 9, 2018 Show version history

I looked through the list of suggested posts and didn't see an answer.

I am trying to capture the index of the current row using .on('click') method:

  $('.addExpTableClass tbody').on('click', function() {
    
    console.log($(this).find('td:first').text());
  });

The results are only showing "Row1x", which is the text from the hidden first column:

The problem is that as I add rows, the value remains "Row 1x" as shown above.

I can't seem to clear the value from the time the function initially runs. Every time I click the count increases, but the value remains the same in the console. What am I missing here?

Thank you in advance

0 0

Answer

SELECTED ANSWER
replied on January 9, 2018

Hi Chris,

There is only one "tbody" element inside table, so in your script $(this).find() would always find the same element.

Actually you should use the "tr" element which is repeated on each row:

  $('.addExpTableClass tbody').on('click', 'tr', function() {  
  	console.log($(this).find('td:first').text());
  	console.log($('.addExpTableClass tr').index($(this)));
  });

 

1 0

Replies

replied on January 10, 2018

Rui, thanks for helping me understand this.  You have advanced my understanding of how syntax works. I still have a long way to go, but this helps me a ton!!

Thanks again

0 0
replied on January 10, 2018

Here is an alternative that I found:


  $('.addExpTableClass tbody').on('click', 'tr', function(e) {
  	 console.log(e.currentTarget.rowIndex);
  });

Additionally here is how to retrieve the column(td) number(index):

$('.addExpTableClass tbody').on('click', 'tr td', function(e) {
      console.log(e.currentTarget.cellIndex);
  });

I hope this helps someone down the road!

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.