Find Checkbox in HTML Table Using JQuery Find Method

Question

I have a HTML table which has the following structure:

<table id="myTable">
  <tr>
     <td><input type="text" name="FullName" value="Tom" /></td>
     <td><input type="checkbox" name="isActive" /></td>
     <td><a href="javascript:void(0);" class="edit">Edit</a>
  </tr>
</table>

When the user clicks the 'edit' link, a Javascript function is called (see below). In this function I need to get the data from the table, i.e., FullName and whether or not isActive has been checked.

 $("#namedTutors").on('click', '.editTutor', function () {
    var tr = $(this).closest("tr");
    var fullName = tr.find("input[name=FullName]").val();
});

I can get the FullName easy enough, but I'm having difficulties retrieving the data to see if isActive has been checked/ticked or not.

Could someone please help.

Thanks.

tr.find("input[name=FullName]").is(':checked')

Manikant Gautam
– Manikant Gautam

2019-04-02 10:05:22 +00:00
Commented Apr 2, 2019 at 10:05 — Manikant Gautam
– Manikant Gautam, Commented Apr 2, 2019 at 10:05

Zakaria Acharki · Accepted Answer · 2019-04-02 10:12:28Z

2

You could select the ckeckbox input by name [name=isActive] then use the .is(':checked') to check whether the ckeckbox is checked or not, like:

$("#namedTutors").on('click', '.editTutor', function() {
  var tr = $(this).closest("tr");
  var fullName = tr.find("input[name=FullName]").val();
  var isActive = tr.find("input[name=isActive]").is(':checked');
  
  console.log( isActive ); 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="namedTutors">
  <tr>
    <td><input type="text" name="FullName" value="Tom" /></td>
    <td><input type="checkbox" name="isActive" /></td>
    <td><a href="javascript:void(0);" class="editTutor">Edit</a>
  </tr>
</table>

edited Apr 2, 2019 at 10:12

answered Apr 2, 2019 at 10:06

Zakaria Acharki

67.5k15 gold badges79 silver badges106 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

tcode Over a year ago

I really appreciate your time and answer. This has helped massively. Thanks.

heraphim · Accepted Answer · 2019-04-02 10:07:18Z

2

if(tr.find('input[name="isActive"]:checked').length) {
     console.log('it is checked');
}

answered Apr 2, 2019 at 10:07

heraphim

3562 silver badges12 bronze badges

Collectives™ on Stack Overflow

Find Checkbox in HTML Table Using JQuery Find Method

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related