Priyanka Maurya Priyanka Maurya - 5 months ago 16
HTML Question

delete row if checkbox is selected

I am trying to delete the row when checkbox is selected. It can be one or many at a time using jquery. But only checkbox is getting deleted.I want to delete full row.I am not able to figure out how it will be done.

html--

<html>
<body>
<table id="pricetable" class="table">
<thead>
<tr>
<th>Size</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="form-group">
<select class="selectbox" name="Priority">
<option>0.5</option>
<option>1</option>
<option>2</option>
</select>
</div>
</td>
<td>
<div class="form-group">
<input type="text" class="form-control" name="groceryName">
</div>
</td>
<td>
<input type="checkbox" name="check">
</td>
</tr>
<tr>
<td>
<div class="form-group">
<select class="selectbox" name="Priority">
<option>0.5</option>
<option>1</option>
<option>2</option>
</select>
</div>
</td>
<td>
<div class="form-group">
<input type="text" class="form-control" name="groceryName">
</div>
</td>
<td>
<input type="checkbox" name="check">
</td>
</tr>
</tbody>
<br>

<button class="button btn btn-info" id="delrow">Delete row</button>
</body>
<script>

$(document).ready(function(){
$('#delrow').click(function(){
$("#pricetable input:checkbox").each(function(){
if (this.checked) {
$(this).remove();
}
return false;

})
});
});

</script>
</html>

Answer

Call : $(this).closest('tr').remove(); to remove the row

Comments