Type Error on datatable change
Type Error on datatable change
Hi! I'm trying to use this incredible plug-in, but got error in my project. I'm trying to use this example - http://datatables.net/examples/advanced_init/events_live.html Simple table with display row data by click on it.
In my project i'm using different tables with different data stored in mySQL, and they loaded by ajax. And I insert input <select> to switch between tables, and using case When I load table at document.ready - there is no errors, clicking on row working perfect. If i changing select, and loading another table, table loading, but click returning error in console ( Uncaught TypeError: Cannot read property '0' of undefine) in string " alert(rowData[0]); ". How to solve error? So this is my JS code:
$(document).ready(function() {
var SelectIn = $('select[name="select_in"]').val();
var table = $('#example').DataTable( {
"processing": true,
"serverSide": true,
"ajax": { url : "core/search_processing.php",
data : { SelectIn : SelectIn }},
"language": {"url": "core/dataTables.russian.lang"},
"order": [[ 0, "desc" ]],
"dom": '<"top"if>rt<"bottom"lp><"clear">',
"displayLength": 15,
"lengthMenu": [[15, 25, 50, -1], [15, 25, 50, "All"]],
} );
$('#example tbody').on( 'click', 'tr', function () {
var rowData = table.row( this ).data();
// ... do something with `rowData`
alert(rowData[0]);
window.open('somepage.php?cn='+rowData[0])
} );
});
function SelectTable(){
var SelectIn = $('select[name="select_in"]').val();
var table = $('#example').DataTable( {
"clear" :true,
"destroy" : true,
"processing": true,
"serverSide": true,
"ajax": { url : "core/search_processing.php",
data : { SelectIn : SelectIn }},
"language": {"url": "core/dataTables.russian.lang"},
"order": [[ 0, "desc" ]],
"dom": '<"top"if>rt<"bottom"lp><"clear">',
"displayLength": 15,
"lengthMenu": [[15, 25, 50, -1], [15, 25, 50, "All"]],
} );
$('#example tbody').on( 'click', 'tr', function () {
var rowData = table.row( this ).data();
// ... do something with `rowData`
alert(rowData[0]);
window.open('patient.php?cn='+rowData[0])
} );
};
HTML code
<body>
<select name="select_in" id="select_in" onChange="javascript:SelectTable();">
<option value="0">0</option>
<option value="1">1</option>
<option value="2" selected="selected">2</option>
</select>
<
table> - standart, as shown in datatables examples.
Replies
I find solution, and all work ok!
Solution http://stackoverflow.com/questions/12934144/how-to-reload-refresh-jquery-datatable