Clone one table into another table through Jquery | Techbirds
Today I am presenting you some trick in jQuery. Some times we have a situation to Clone a table in HTML into another table. We can find lots of solution on web but what if the table also contain some input fields and whatever we filled in the first table to be displayed as it is in second table along with the data filled in the input field. Check out the Working Demo
HTML PART :
| Smith | 50 | |
| Jackson | 94 | |
| Doe | 80 |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
|
CSS PART :
table,th,td { border:1px solid black; border-collapse:collapse; }
|
table,th,td { border:1px solid black; border-collapse:collapse; } |
JQUERY / JAVASCRIPT
$(‘#click’).click(function(){ // var table = $(“#firstTable”); $(‘#firstTable tr’).each(function() { // alert($(this).closest(‘tr’).clone()); quoterow = $(this).closest(‘tr’).clone(); $(“#secondTable”).append(quoterow); }); })
|
$(‘#click’).click(function(){ // var table = $(“#firstTable”); $(‘#firstTable tr’).each(function() { // alert($(this).closest(‘tr’).clone()); quoterow = $(this).closest(‘tr’).clone(); $(“#secondTable”).append(quoterow); }); }) |
If you have any question regarding this post please don’t hesitate to ask.
1,296 total views, 2 views today
Share this On
