I have a simple table created in HTML with three columns, none of which are suitable to be used as a primary key. I gather from the technical note that I need to have a primary key column specified to be able to edit. How do I do this in a pure client side app where I am just working with a table in Javascript? Do I need to create a hidden column or something, and then somehow automatically populate it when loading and when adding new rows?
editor = new $.fn.dataTable.Editor({
table: "#example",
fields: [{
label: "Goal:",
name: "goal"
}, {
label: "Action Step:",
name: "action_step"
}, {
label: "Start date:",
name: "start_date",
type: "datetime"
}]
});
$('#example').DataTable( {
dom: "Bfti",
"paging": false,
"order": [[ 2, "asc" ]],
columns: [
{ data: "goal" },
{ data: "action_step" },
{ data: "start_date" }
],
select: true,
buttons: [
{ extend: "create", editor: editor },
{ extend: "edit", editor: editor },
{ extend: "remove", editor: editor }
]
});
<table id="example" class="table table-striped table-bordered display" cellspacing="0" width="100%">
<thead>
<tr>
<th>Goal</th>
<th>Action Step</th>
<th>Start date</th>
</tr>
</thead>
<tbody>
<tr>
<td>Success</td>
<td>Get success first</td>
<td>2010/04/25</td>
</tr>
<tr>
<td>Success</td>
<td>Get success</td>
<td>2011/04/25</td>
</tr>
<tr>
<td>Success</td>
<td>Get success at last</td>
<td>2012/04/25</td>
</tr>
<tr>
<td>Success</td>
<td>Get success</td>
<td>2011/04/25</td>
</tr>
</tbody>
</table>