SharePoint 365 List, refreshing table error
SharePoint 365 List, refreshing table error
I am working on a SharePoint 365 List that is using the datatables plugin, the code below works well but when I try to
refresh "table.ajax.reload();" I get this error: "Uncaught Type-error: Cannot set property 'data' of null;
Been fighting this for a while, any ideas how to change the code below to make the refresh work? Looks like the data is not loading into ajax.
What is the correct way to code this?
Thanks to @EFH52 for some of the code.
<html>
<head>
</head>
<body>
<div class="container">
<div class="searchPanes"></div>
<table id="projects" class="display dataTable" cellspacing="0" width="100%">
<thead>
<tr>
<th></th>
<th>Project Number</th>
<th>Project Description</th>
...
</tr>
</thead>
<tfoot>
</tfoot>
</table>
</div>
</body>
</html>
//I found the function on the Datatables.net Forum, working fine but the data is not loaded into ajax.
$(document).ready(function () {
getListItemsByListName(
{
listName: 'CapEx%20Projects',
//select: 'Id',
expansion: 'Engineering_x0020_Lead/Title,Currency/CurrentRate,Currency/CurrencyType',
// order: 'Id asc'
}).done( function (data){
var table = $('#projects').dataTable({
data: data.d.results, //needs to be ajax
order: [[1,'asc']],
columns: [
{data: 'Id'},
{data: 'CapEx_x0020_Number'},
...
],
buttons: [
'copy', 'excel', {
extend: 'pdfHtml5',
orientation: 'landscape',
pageSize: 'LEGAL'
},
{
text: 'Reload',
action: function ( e, dt, node, config ) {
dt.ajax.reload();
},
}
]
});
});
});
//Modified function to make the expansion work correctly.
function getListItemsByListName(arg) {
var listName = arg.listName;
var selection = arg.select;
var filter = arg.filter;
var expansion = arg.expansion;
var order = arg.order;
if (selection) { selection='?$select='+selection; } else selection = '?$select=*';
if (filter) { filter='&$filter='+filter; } else filter = '';
if (expansion) { expansion= ',' +expansion+'&$expand='+expansion; } else expansion = '';
if (order) { order='&$orderby='+order; } else order = '';
return $.ajax({
url: "../_api/web/lists/getByTitle(%27"+listName+"%27)/items"+selection+filter+expansion+order+"&$top=2000",
method: "GET",
headers: { "Accept": "application/json; odata=verbose" },
});
}
This question has an accepted answers - jump to answer
Answers
It doesn't appear that you have the
ajax
option in your DataTable initialisation code (unless you've clipped it out)? That would mean thatajax.reload()
can't do a reload since it doesn't know anything about your Ajax source.It looks like your Ajax source is external to DataTables, so use
clear()
and thenrows.add()
to add the new data.Allan
Thank you for your quick answer. I'll give it a try.
It's working..... Thank you so much!
The modification are below