I have two tables, I move need to move rows between them. First table have add button, which adds selected items from table 1 to table two. My add works fine and remove on the second table works but it does.
My tables
<table id="stockForOrder" class="display">
<thead>
<tr>
<th>Book Name</th>
<th>Price</th>
<th>ISNB</th>
<th>Available Quantity</th>
<th>Quantity</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr>
<td>HTML5/CSS3 Fundamentals</td>
<td>R600.00</td>
<td>00000064</td>
<td><input type="text" id="quantityAvaliable"
name="quantityAvaliable" class="form-control"
readonly value="21" /></td>
<td><input type="text" id="quantity"
name="quantity" class="form-control" value="" /></td>
<td><input class="addLineItem" type="button"
value="Add"></td>
</tr>
</tbody>
</table>
<table id="toOrder" class="display">
<thead>
<tr>
<th>Book Name</th>
<th>Price</th>
<th>ISNB</th>
<th>Available Quantity</th>
<th>Quantity</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tbody>
<table>
Java Script code
//When the button is clicked create table 2
$(".addLineItem").on("click", function() {
var itemsBooks = [];
var row = $(this).closest("tr").clone();
itemsBooks.push(row);
row.appendTo($("#toOrder"));
$(this).closest('tr').remove();
$('input[type="button"]', row).removeClass('AddNew').addClass('RemoveRow').val('Remove');
});
//remove table 1 from table 2
$('table').on('click', '.RemoveRow', function(){
$(this).closest('tr').remove();
});
$('#stockForOrder').on('click', '.addLineItem', function() {
// $(".addLineItem").on("click", function() {
var itemsBooks = [];
row = $(this).closest("tr").clone();
itemsBooks.push(row);
row.appendTo($("#toOrder"));
$(this).closest('tr').remove();
$('input[type="button"]', row).removeClass('AddNew').addClass('RemoveRow').val('Remove');
});
//remove table 1 from table 2
$('#toOrder').on('click', '.RemoveRow', function(){
row = $(this).closest("tr").clone();
row.appendTo($("#stockForOrder"));
$(this).closest('tr').remove();
$('input[type="button"]', row).removeClass('RemoveRow').addClass('addLineItem').val('Add');
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.