Related Posts Plugin for WordPress, Blogger...

About

Follow Us

Friday, 3 April 2015

Introduction
In this article I will explain how to remove rows from table using jQuery. We can delete selected row from table using jQuery.

Following jQuery Script will use to remove Table row:
<script type="text/javascript">
$(function() {
$('input[type="button"]').click(function(e) {
var row = $(this).closest('tr');
row.remove()
})
})
</script>

Full Source Code For Sample Application:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery Remove Previous table tr</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
$(function() {
$('input[type="button"]').click(function(e) {
var row = $(this).closest('tr');
row.remove()
})
})
</script>
</head>
<body>
<form id="form1">
<div>
<table>
<tr>
<td><input type="button" value="Delete Row1"/></td>
</tr>
<tr>
<td><input type="button" value="Delete Row2" /></td>
</tr>
<tr>
<td><input type="button" value="Delete Row3"/></td>
</tr>
</table>
</div>
</form>
</body>

</html>

Categories: , ,

0 comments:

Post a Comment