Table row and column number in jQuery

Question

How do I get the row and column number of the clicked table cell using jQuery  i e        td   onClick function event      var row          var col

User · Answer

td   click function         var myCol     this  index        var  tr     this  closest  tr        var myRow    tr index

User · Answer

Get COLUMN INDEX on click     this  closest  td   index      Get ROW INDEX on click     this  closest  tr   index

User · Answer

its better to bind a click handler to the entire table and then use event target to get the clicked TD  Thats all i can add to this as its 1 20am

User · Answer

You can use the Core index function in a given context  for example you can check the index of the TD in it s parent TR to get the column number  and you can check the TR index on the Table  to get the row number      td   click function      var col     this  parent   children   index   this      var row     this  parent   parent   children   index   this  parent       alert  Row      row      Column      col         Check a running example here

User · Answer

Can you output that data in the cells as you are creating the table   so your table would look like this    lt table gt     lt thead gt     lt  thead gt     lt tbody gt       lt tr gt  lt td data-row  1  data-column  1  gt value lt  td gt         lt td data-row  1  data-column  2  gt value lt  td gt         lt td data-row  1  data-column  3  gt value lt  td gt  lt  tr gt      lt tbody gt   lt  table gt    then it would be a simple matter     td   click function event       var row     this  attr  data-row       var col     this  attr  data-col

User · Answer

Off the top of my head  one way would be to grab all previous elements and count them      td   click function         var colIndex     this  prevAll   length      var rowIndex     this  parent  tr   prevAll   length

[jquery] Table row and column number in jQuery

Examples related to jquery