problem after recreate

mijus

It seems like I can't find a proper way to destroy Datatable. When I click on it, I get so much onclick events as how many times Datatable is recreated. Put this in /examples/data_sources/ajax.html:

[code]
var oTable = '';
var columns = [ { "sTitle": "Rendering engine", "sWidth": "20%", "sClass": "center" },
{ "sTitle": "Browser", "sWidth": "25%" },
{ "sTitle": "Platform(s)", "sWidth": "25%", "sClass": "center" },
{ "sTitle": "Engine version", "sWidth": "15%", "sClass": "center" },
{ "sTitle": "CSS grade", "sWidth": "15%", "sClass": "center" }
];

function tableEmpty() {
oTable.fnDestroy();
$("#example").empty();
}

function tableCreate() {

oTable = $('#example').dataTable( {
"bProcessing": true,
"aoColumns": columns,
"sAjaxSource": '../ajax/sources/arrays.txt'
} );

$(document).on("click", "#example tbody tr", function(e){
cell_text = $("td:eq(0)", this).text();
alert("cell_text:"+cell_text);
});
}
[/code]

[code]


DataTables AJAX source example


Preamble
Table empty
Table create

Live example






[/code]

I want a single alert every time. How can I achieve that?