jQuery - Find Value of a Checkbox in a Table

Question

I have the following html:

When I click on the Save Schedule button, I need to navigate up, then down, to the checkbox input and see if it is checked or not,preferably using JQUERY. I've tried various combinations of closest, parent, etc, but can't figure it out. EDIT:

I have this set up in a Kendo grid as:

 columns.Command(command => command.Custom("Save").Text("<span class=\"k- 
 icon k-i-check\"></span>Save 
Schedule").Click("saveSchedules")).Width(80).HtmlAttributes(new { @class = 
"text-center" });

My saveSchedules function is

 function saveSchedules(e) {

        e.preventDefault();

        var dataItem = $(e).parent('tr').find('.enabled-checkbox').prop('checked');

/// etc

How do I do this in the function?

$button.parent('tr').find('.enabled-checkbox').prop('checked') supposing there is no other checkbox of this class in the row. — ZorgoZ
– ZorgoZ, Commented Sep 13, 2019 at 20:13
@Scott, e is an event, you need to start from $(e.currentTarget), which is the control clicked. — ZorgoZ
– ZorgoZ, Commented Sep 13, 2019 at 20:36
I use var dataItem = $(e.currentTarget).parent('tr').find('.enabled-checkbox').prop('checked'); now. If I log dataItem to console I get "undefined". — Scott
– Scott, Commented Sep 13, 2019 at 20:39

ZorgoZ · Accepted Answer · 2019-09-13 21:00:57Z

1

Try this approach:

$('a').on('click', (e) => {
  let v = $(e.currentTarget).closest('tr').find('.enabled-checkbox').prop('checked')
  console.log(v)
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tr>
    <td>TD1</td>
    <td>TD2</td>
    <td>
      <span>
        <input type="checkbox" class="enabled-checkbox" />
      </span>
    </td>
    <td>TD4</td>
    <td>
      <a href="#">Button</a>
    </td>
  </tr>
</table>

answered Sep 13, 2019 at 21:00

ZorgoZ

3,7582 gold badges21 silver badges51 bronze badges

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

2 Comments

Scott Over a year ago

If I use $(e.currentTarget).parent('tr').find('.enabled-checkbox') WITHOUT .prop, I get the checkbox. With it, I get undefined.

Scott Over a year ago

Thanks. I changed to closest as suggested by Zorgo above.

Collectives™ on Stack Overflow

jQuery - Find Value of a Checkbox in a Table

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related