CODEWITHSUNDEEP
javascriptjquery
SoptikHa
SoptikHa

Reputation: 467

How to change element in another element

I have a page which has several <tr> elements, which contains three things:

<table>
  <!-- Some other <tr>s there... -->
  <tr id="somethingGeneratedWhichIDontKnow">
    <td id="aduju1j">13.</td>
    <td id="ajdi1">lorem ipsum dolor sit amet consectetur adipiscing elit</td>
    <td id="3j21">
      <input type="checkbox" id="3125ac_a">
    </td>
  </tr>
  <!-- Some other <tr>s there... -->
</table>

I need to find <tr> element which has 1st <td> with some number and change the checkbox there.

So my question is: How can I find the right checkbox? ID of elements is generated by web, so I can't select it by ID. I accept both javascript and jQuery answers.

I'm new to JS and jQuery so thanks you for all your help :-)

Upvotes: 0

Views: 76

Answers (3)

maverickosama92
maverickosama92

Reputation: 2725

How about that:

var chkList = $('#tbl tr').map(function(t){
    return {
        num: $(this).children('td:first').text(),
        chk: $(this).find(':checkbox')
    }
}).get();

console.log('checkboxesList', chkList);

fiddle: https://jsfiddle.net/zpavrgeo/

Upvotes: 0

Joe
Joe

Reputation: 2540

var checkbox = $('td:contains("13.")').eq(0).parent().find(":checkbox")

Upvotes: 2

Jamiec
Jamiec

Reputation: 136074

Find a tr where the first td contains a number, then use that tr as the basis to find the checkbox.:

// find the tr
var $tr = $('table tr').filter(function(){
    return $(this).find('td:first').text().match("[0-9]+");
}).first();

// find the checkbox inside a td of the found tr
var $cb = $tr.find("td :checkbox");
console.log($cb.attr('id'));

//here $cb is the checkbox
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <!-- Some other <tr>s there... -->
  <tr id="somethingGeneratedWhichIDontKnow">
    <td id="aduju1j">13.</td>
    <td id="ajdi1">lorem ipsum dolor sit amet consectetur adipiscing elit</td>
    <td id="3j21">
      <input type="checkbox" id="3125ac_a">
    </td>
  </tr>
  <!-- Some other <tr>s there... -->
</table>

Upvotes: 0

Related Questions