var divId = '#elementPozycji tbody'; var element = $(divId).html(); var i = $('#elementPozycji').data('lastId'); var table = $('#listaPozycji'); $('button#dodajPozycje').click(function() { i++; $(divId).data('lastId', i); record = element.replace(/%s/g, i) table.append(record); $('.usunPozycje').on('click', function() { var id = $(this).data('id'); $(this).parent().remove(); }); });
<button type='button' class='btn btn-flat btn-default' id='dodajPozycje'><i class='fa fa-plus'></i> Dodaj pozycje</button> <form method='post'> <table class='table table-condesed table-striped table-responsive'> <thead> <tr> <th>Wysokość</th> <th>Szerokość</th> <th>Ilość</th> <th>CenaNetto</th> <th>Inne</th> </tr> </thead> <tbody id='listaPozycji'></tbody> </table> </form> <table style='display:none;' id='elementPozycji' data-last-id='0'> <tbody> <tr> <td><input type='text' name='H[%s]' class='form-control' placeholder='wysokosc'></td> <td><input type='text' name='L[%s]' class='form-control' placeholder='szerokosc'></td> <td><input type='text' name='ilosc[%s]' class='form-control' placeholder='ilosc'></td> <td><input type='text' name='cena[%s]' class='form-control' placeholder='cena'></td> <td class='usunPozycje btn btn-flat'>USUN</td> </tr> </tbody> </table>