Child of a row is empty after page reload

mariokitz

I am using Ajax to get data from a SharePoint list and use DataTables to display that data. I am adding child rows to certain rows. Works fine, but as soon as I hit F5 to do a page reload the child row is empty. Pressing STRG+F5 works fine and child data is displayed. Seems to be an issue with the cache, but I have no clue. Please help!

Here is my code:

<script type="text/javascript">

/* Formatting function for row details - modify as you need */
function format ( d ) {
    // `d` is the original data object for the row
    debugger;
    return '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">'+
        '<tr>'+
            '<td>Full name:</td>'+
            '<td>'+d.Title+'</td>'+
        '</tr>'+
        '</table>';
}

function tabelleFuellen (d) {

$(document).ready(function() {

var table = $('#tbOPL').DataTable({
processing: true,
ordering: true,
paging: false,
"aaData": d.results,
"aoColumns": [
{ "orderable": false, "mData": null, "defaultContent": ''},
{ "mData": "ID", "defaultContent": ''},
{ "mData": "Eintragstyp", "defaultContent": '' },
{ "mData": "Kategorie_x0020__x0028_zur_x0020", "defaultContent": '' },
{ "mData": "Title", "defaultContent": '' },
{ "mData": "Ausl_x00f6_sendes_x0020_Ereignis", "defaultContent": '' },
{ "mData": "Aktueller_x0020_Status", "defaultContent": '' },
{ "mData": "Letztes_x0020_Ergebnis_x002f_For", "defaultContent": '' },
{ "mData": "Aktueller_x0020_Beginn", "defaultContent": '' },
{ "mData": "Aktuelle_x0020_Frist", "defaultContent": '' },
{ "mData": "Verantwortlich", "defaultContent": '' },
{ "mData": "Ansprechpartner.LastName", "defaultContent": '' },
{ "mData": "Priorit_x00e4_t_x0020_der_x0020_", "defaultContent": '' },
{ "mData": "Friststatus", "defaultContent": '' },
{ "mData": "Eintrag_erfolgt_durch.LastName", "defaultContent": 'IB-Manager (ITZBund)'},
{ "mData": "Modified", "defaultContent": ''  },
{ "mData": "UnterpunktvonId", "defaultContent": '' }
]});

var ergebnis = d.results

table.rows().every( function ( rowIdx, tableLoop, rowLoop ) {
    var zeilenDaten = this.data();
    debugger;
    for(var i=0; i < ergebnis.length; ++i) {
        if(zeilenDaten.ID == ergebnis[i].UnterpunktvonId){
        debugger;
        this.child(format ( ergebnis[i] )).show();
        
    }
}
  
} );


});

}

var call = $.ajax({
url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/Lists/GetByTitle('Offene Punkte')/items?$select=ID,Eintragstyp,Kategorie_x0020__x0028_zur_x0020,Title,Ausl_x00f6_sendes_x0020_Ereignis,Aktueller_x0020_Status,Letztes_x0020_Ergebnis_x002f_For,Aktueller_x0020_Beginn,Aktuelle_x0020_Frist,Verantwortlich,Ansprechpartner/LastName,Priorit_x00e4_t_x0020_der_x0020_,Friststatus,Eintrag_erfolgt_durch/LastName,Modified,UnterpunktvonId&$expand=Eintrag_erfolgt_durch/LastName,Ansprechpartner/LastName&$top=5000",
type: "GET",
dataType: "json",
headers: {
Accept: "application/json;odata=verbose"
}
});

call.done(function (data,textStatus, jqXHR){
 tabelleFuellen(data.d)
}
);

call.fail(function (jqXHR,textStatus,errorThrown){
alert("Error retrieving Tasks: " + jqXHR.responseText);
});





</script>