I start the Datables in this way, notice that it has an Edit button on each line:
$(document).ready(function () {
table = $("#table").DataTable({
columns: [
{ title: 'Nome' },
{ title: 'Cidade' },
{ title: 'Pais' },
{ title: 'Status' },
{ title: 'Telefone' },
{ title: 'E-mail' },
{
"data": null,
"defaultContent": '<button class="btn" data-toggle="modal" data-target="#myModal">Editar</button>'
}
],
"searching":false,
paging: false,
"language": {
"url": "//cdn.datatables.net/plug-ins/1.10.15/i18n/Portuguese-Brasil.json"
}
});
});
I fill in my table with the following function in javascript:
function preencherTabela(result) {
table.clear().draw();
$('#table tbody>*').empty();
var dataSet = [];
$.each(result, function(index, data)
{
dataSet.push([
data.nome,
data.cidade,
data.pais,
data.status,
data.telefone,
data.email
]);
})
table.rows.add(dataSet).draw();
}
In this Edit button I call a modal that will open an edit screen.
On this screen I need the information that is in this line to do the editing. When filling in the rows of the table how to put this information in the Edit button?
I need to pass to the modal all columns of the row where the user clicked the edit button. Maybe if I could put a data-id to identify each row, when filling the table, but I do not know how to do this with Datables when I use its own function to fill table.
EDIT I could use this to get every column
var data = table.row( $(this).parents('tr') ).data();
var nome = data[0];
var cidade= data[1];
But if I need to add a column I will have to change all references, I do not want to do that.