Click button on multiple dynamic tables

Click button on multiple dynamic tables

PedroSimaoPedroSimao Posts: 2Questions: 1Answers: 0

Hello all and thanks in advance for your help!

I have some tabs that contain one datatable each, all created dynamically. Each datatable contains 1 button to copy the values on that specific row to another datatable.

The problem I'm facing is that only the values grabbed on the last tab are copied correctly. On the other tabs, the values grabbed belong to the last tab.

Heres a link to the datatables (http://lettersmatters.pt/nutricional.php)

This is the code that creates the tables based on a mysql and php query:

var productTables = <?php echo(json_encode($catlength)); ?>;

productTables = productTables + 1;

for( var i = 1; i < productTables ; i++){
var genTable = '#productsTable' + i;
var productsTable = $(genTable).DataTable({
                select:     true,
                "paging":   false,
                "info":     false,
                "language": {
                    "zeroRecords": "Nenhum registo encontrado",
                    "infoEmpty": "Sem registos",
                    "search": "Procurar"},
                "columnDefs": [ {
                "targets": -1,
                "data": null,
                "defaultContent": "<button>+</button>"
                } ]
            });

$(genTable + ' tbody').on( 'click', 'tr', function () {
            if ( $(this).hasClass('row_selected') ) {
                $(this).removeClass('row_selected');
            }
            else {
                $(this).addClass('row_selected');
            }
        } );

$(genTable + ' tbody').on( 'click', 'button', function () {
    var data = productsTable.row( $(this).parents('tr') ).data();
    orderDataSet = [
                data[0], data[1], data[2], data[3]
            ];
    orderTable.row.add(orderDataSet).draw(false);
} );

What am I missing here?

Thank you again!

Answers

This discussion has been closed.