CODEWITHSUNDEEP
javascriptjquery
user3408779
user3408779

Reputation: 997

Remove entire table row having checkbox which was unchecked , when user click on submit button

I have table with checkall/uncheckall check box functionality and table is having and some input fields like text boxes, dropdowns. User should select at least one checkbox for processing the data in the table. That is working fine. For example table is having 3 rows and user select any one checkbox and click on submit button then remaining two table rows should be removed and not being submitted. I tried with the below one .

$("input:not(:checked)").each(function () {
      $('input:not(:checked)').closest('tr').remove();
});

But this one is removing entire table. So I need only those table rows which are unchecked should be removed. Any help would be greatly appreaciated. enter image description here

Upvotes: 1

Views: 1383

Answers (2)

PotatoesFall
PotatoesFall

Reputation: 355

It seems to be working fine for me: https://jsfiddle.net/r9zgvbqu/7/

Two comments, you are using the .each() function to do something for all elements selected by "input:not:(:checked)", but in that function selecting everything again. so you are just doing the same thing multiple times. You can skip that step, and also skip the .each()-$(this) combination that has been suggested, by straightup doing:

$("input:not(:checked)").closest('tr').remove();

This removes all the you want.

EDIT: Your problem is that you are selecting all non-checked inputs, including text inputs etc. You can specify the type of input you are selection: input[type=checkbox]:not(:checked)

In general, I would avoid selecting elements by their tag name. It's better to give the relevant checkboxes a class, and you can select them by class.

Here is a fixed version of your fiddle: https://jsfiddle.net/927sdh8n/

And here is a simpler and safer version using classes: https://jsfiddle.net/qz53wfxc/

Upvotes: 1

RJCoder
RJCoder

Reputation: 53

Assuming you don't use <th></th>, your header row also got selected because that checkbox is also unchecked. May be that will be the reason all rows got deleted. Console input:not:(:checked) it . It will give clear idea.

Edit: Then try this, may be this will work

$('#tableid').find('tr[input:not:(:checked)]').each(function()
{
      $(this).remove();
}

Upvotes: 1

Related Questions