Delete html 5 row of table containing data attribute with jquery attribute

Question

I understand how to get the attribute of a table object $('#tableid tr').attr('data-id') , which uses HTML5 data attributes. However, when I try to delete a row based on the data-id attribute, it does not work.

When I did something like this:

 var theRowId = $('#tableid tr').attr('data-id'); $('#tableid tr#'+theRowId).remove(); 

it did not work. Html 5 data attributes should be processed like any other attribute, right?

Answer 1

You need to pass the index tr, which requires the data attribute from

$('#tableid tr:eq(0)'); // The first row in the table

$('#tableid tr:eq(1)'); // The second row in the table

Since the table may have several rows

 var theRowId = $('#tableid tr:eq(1)').attr('data-id'); // Get the Second Row id $('#tableid tr#'+theRowId).remove(); // Remove the row with id 

OR if you know the row id .. just do it

 $('#tableid tr[data-id="'+theRowId+'"]').remove(); 

Answer 2

You need to change the way the data-id attribute is selected. Try to select the line as follows:

 $('#tableid tr[data-id="'+theRowId+'"]').remove(); 

This will select for tr with the data-id attribute that matches.

Answer 3

data-id is not like id

You need to do this:

  $('#tableid tr[data-id='+ theRowId +']').remove()