CODEWITHSUNDEEP
jquerycss
Masoud Andalibi
Masoud Andalibi

Reputation: 3228

How to get nth-child value of a td within the table using jquery based on its text

I am trying to get the number of td:nth-child based on the text of the cell let's say i have this table:

<table class="table" id="inputTable">
      <thead>
        <tr>
          <th>Id</th>
          <th>Name</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>1</td>
          <td><span>mike</span></td>
        </tr>
        <tr>
          <td>2</td>
          <td><span>eric</span></td>
        </tr>
        <tr>
          <td>3</td>
          <td><span>jonas</span></td>
        </tr>
    </tbody>
</table>

I want to know what is the value of td:nth-child when im using filter method and find the cell text which is equal to jonas, is it possible using jquery?

Upvotes: 0

Views: 4333

Answers (1)

Mohamed-Yousef
Mohamed-Yousef

Reputation: 24001

For td index 

$('tr span:contains("jonas")').closest('td').index();  //output 1

For tr index 

$('tr span:contains("jonas")').closest('tr').index();  // output 2

Index start from 0 so you will need to add +1 for nth-child ..

Demo

And about I want to know what is the value of td:nth-child you can use something like this

$('tr:nth-child(2) td:nth-child(2)').text()   // nth-child starts from 1 not like index from 0

The above code will give you the second tr tr:nth-child(2) and second td text on this tr td:nth-child(2) and if you have an input you need to use .val() instead of .text()

Demo

Upvotes: 2

Related Questions