How to assign jQuery AJAX success data to DataTables?
The jQuery AJAX return data like:---
[
{"CustomerName":"ABC","CustomerID":"001"},
{"CustomerName":"CDE","CustomerID":"002"},
{"CustomerName":"EFG","CustomerID":"003"},
{"CustomerName":"GHI","CustomerID":"004"},
{"CustomerName":"IJK","CustomerID":"005"}
]
My Code is
<!DOCTYPE html>
<html>
<head>
<title>Flexmonster Demo</title>
<script src="js/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="js/jquery.dataTables.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#example').dataTable({
"bServerSide": true,
"sAjaxSource": "MethodName",
"sServerMethod": "POST",
"bStateSave": true,
"bPaginate": true,
"bProcessing": true,
"sPaginationType": "full_numbers",
"aaSorting": [[1, 'asc']],
"fnServerData": fnServerObjectToArray(),
});
});
fnServerObjectToArray = function (aElements) {
return function (sSource, aaData, fnCallback) {
$.support.cors = true;
$.ajax({
"type": "POST",
"url": "MethodName",
"data": JSON.stringify({'ParameterA': '123', 'ParameterB': '123'}),
"contentType": "application/json; charset=utf-8",
"dataType": "json",
"processdata": true,
"success": function (data) {
var output = data.MethodNameResult[0];
var json = JSON.stringify(output);
fnCallback(json);
},
error: function (err) {
alert(err);
}
});
}
};
</script>
</head>
<body>
<table id="example">
</table>
</body>
</html>
The jQuery AJAX return data like:---
[
{"CustomerName":"ABC","CustomerID":"001"},
{"CustomerName":"CDE","CustomerID":"002"},
{"CustomerName":"EFG","CustomerID":"003"},
{"CustomerName":"GHI","CustomerID":"004"},
{"CustomerName":"IJK","CustomerID":"005"}
]
My Code is
<!DOCTYPE html>
<html>
<head>
<title>Flexmonster Demo</title>
<script src="js/jquery-1.8.3.min.js" type="text/javascript"></script>
<script src="js/jquery.dataTables.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#example').dataTable({
"bServerSide": true,
"sAjaxSource": "MethodName",
"sServerMethod": "POST",
"bStateSave": true,
"bPaginate": true,
"bProcessing": true,
"sPaginationType": "full_numbers",
"aaSorting": [[1, 'asc']],
"fnServerData": fnServerObjectToArray(),
});
});
fnServerObjectToArray = function (aElements) {
return function (sSource, aaData, fnCallback) {
$.support.cors = true;
$.ajax({
"type": "POST",
"url": "MethodName",
"data": JSON.stringify({'ParameterA': '123', 'ParameterB': '123'}),
"contentType": "application/json; charset=utf-8",
"dataType": "json",
"processdata": true,
"success": function (data) {
var output = data.MethodNameResult[0];
var json = JSON.stringify(output);
fnCallback(json);
},
error: function (err) {
alert(err);
}
});
}
};
</script>
</head>
<body>
<table id="example">
</table>
</body>
</html>