Question

Jquery on Checkboxes in a table

Forms

Updated April 27, 2017

asked on April 26, 2017

Hello I have a request from a customer to have checkboxes of a same field that are nested in a table row automatically fill if one of the selections is checked. For instance in the image: if All Meals is selected they would like the other check boxes to also be checked automatically.

I have been able to do this with a field outside of the table using the following code

$(document).ready (function () {
  function checkbox() {
    $('.checkbox input:checked').each(function () {
      if ($(this).val() == "choice1") 
      {
        $('.checkbox input').prop('checked', true);
      }
    });
  }

  $('.checkbox').change(checkbox)
});

But I am not quite sure how to go about nesting this within the table. Anyone have any thoughts?

0 0

Answer

SELECTED ANSWER

replied on April 27, 2017 • Show version history

Hi Shane,

Here is an example for making it work in table (need to add css class 'table' on the table)

$(document).ready (function () {
  function checkbox() {
    $('.checkbox input:checked').each(function () {
      if ($(this).val() == "choice1") 
      {
        $(this).closest('div').find('input:visible').prop('checked', true);
      }
    });
  }

  $('.checkbox').change(checkbox);
  $('.table').on('change', '.checkbox', checkbox);
});

1 0

Replies

replied on April 27, 2017 • Show version history

What do you mean by nested? They're already in the table.

0 1

You are not allowed to follow up in this post.

Question

Question

Jquery on Checkboxes in a table

Answer

Replies

Sign in to reply to this post.