1

I have some rows in table having classes like:

<tr class="DrillDownRow">
    <td>211</td>
    <td>namex</td>
    <td>4</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>4</td>
</tr>
<tr class="DrillDownRow">
    <td>212</td>
    <td>namey</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>3</td>
    <td>0</td>
    <td>0</td>
    <td>3</td>
</tr>

now when one row clicked i get it in jquery and perform some work. Now i want to get index of td on which mouse clicked:

$(document).ready(function() {
    $('.DrillDownRow').css('cursor','pointer');
    $(document).on('click',".DrillDownRow", function(){
        //here i want to check on which td it clicked, like index number of clicked td.     
    });                         
}); 
Imran Qamer
  • 2,253
  • 3
  • 29
  • 52

2 Answers2

4

Try using cellIndex.

$('.DrillDownRow td').click(function(){
var td = this.cellIndex
console.log(td)
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<table>
<tr class="DrillDownRow">
    <td>211</td>
    <td>namex</td>
    <td>4</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>4</td>
</tr>
<tr class="DrillDownRow">
    <td>212</td>
    <td>namey</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>3</td>
    <td>0</td>
    <td>0</td>
    <td>3</td>
</tr>
</table>
Suchit kumar
  • 11,809
  • 3
  • 22
  • 44
1

$('.DrillDownRow td').click(function(){
var td = $(this).text();
console.log(td)
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<table>
<tr class="DrillDownRow">
    <td>211</td>
    <td>namex</td>
    <td>4</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>4</td>
</tr>
<tr class="DrillDownRow">
    <td>212</td>
    <td>namey</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>3</td>
    <td>0</td>
    <td>0</td>
    <td>3</td>
</tr>
</table>

Try this way.

In your click event add td to get the click event of td

guradio
  • 15,524
  • 4
  • 36
  • 57