TypeError: n is undefined when trying to sort datatable datetime coloum

sumdeb_git@yahoo.co.in

Hi..
I have a column with mysql datetime..whenever am trying to sort , in console its saying.. TypeError: n is undefined.

dataTables/1.10.7/css/jquery.dataTables.min.css
jquery/1.9.1/jquery.min.js
jquery/plugins/dataTables/1.10.7/js/jquery.dataTables.min.js

My json data:-
{'id': 524, 'site': 'lab14', 'devicetype': 'ios', 'hostname': 'lab14-co-acc-rsw1xser3', 'status': 'COMPLETED', 'username': 'Sunderdebast', '****stage_date': '2020-04-18 13:17:48****', 'model': 'C9410R', 'deployment_id': '40a9b37b-e771-44d4-86db-bc304e0c0d09', 'download_url': 'https://**.com/40a9b37b-e771-44d4-86dbsss-bc304e0c0d09/lab14-co-acc-rxwc/lab14-co-acc-rsw1x823.log'}]

Am using vanilla JS ajax request to dynamically add rows to a table and then initiate

$(document).ready(function() {
$.fn.dataTable.ext.errMode = 'none';
$('#History').DataTable();
} );

Evertthing works except sorting on datetime.

2020-04-14 09:47:37 ---> This is how i am getting in the datatable.

colin

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

sumandeb_git@yahoo.co.in

// Get the staging history data from Database and populate in UI
document.getElementById("History staging").addEventListener('click', gethistory)
function gethistory(){
const req = new XMLHttpRequest();

req.open('POST', '/gethistory/', true);
req.setRequestHeader('content-type', 'application/x-www-form-urlencoded;charset=UTF-8');
// send Post body ( osveriosn, model and modeltype )
req.send()
req.onreadystatechange = function () {
// if backend process is sucess then change the content
if(req.readyState === XMLHttpRequest.DONE && req.status === 200) {

  // console.log(JSON.parse(req.responseText))
  var History = document.getElementById("History")
  var hist_body = document.getElementById("hist-body")


  var res = JSON.parse(req.responseText);

  for (i=0; i < res.length; i++){
    // console.log(res[i])

    var row = document.createElement("tr")

    var cell0 = document.createElement("td")
    var cell1 = document.createElement("td")
    var cell2 = document.createElement("td")
    var cell3 = document.createElement("td")
    var cell4 = document.createElement("td")
    var cell5 = document.createElement("td")
    var cell6 = document.createElement("td")
    var cell7 = document.createElement("td")
    var cell8 = document.createElement("td")
    var cell9 = document.createElement("td")

    cell0.innerHTML = `${res[i]["hostname"]}`
    cell1.innerHTML = `${res[i]["site"]}`
    cell2.innerHTML = `${res[i]["devicetype"]}`
    cell3.innerHTML = `${res[i]["model"]}`
    cell4.innerHTML = `${res[i]["status"]}`
    cell5.innerHTML = `${res[i]["deployment_id"]}`
    // cell6.innerHTML = `${res[i]["download_url"]}`
    // cell6.innerHTML = "<a href=`/download_stage_log/${res[i]["download_url"]}`>Download</a>"
    dep_id = `${res[i]["deployment_id"]}`;


    cell6 = document.createElement("a")
    cell6.setAttribute("href", `/download_stage_log/${dep_id}/${res[i]["hostname"]}`)
    cell6.innerHTML = "Download"

    cell7.innerHTML = `${res[i]["username"]}`

    cell8 = document.createElement("a")
    cell8.setAttribute("href", `/download_stage_backupConfig/${dep_id}/${res[i]["hostname"]}`)
    cell8.innerHTML = "Download"
    // console.log(`${res[i]["stage_date"]}`)

    cell9.innerHTML = `${res[i]["stage_date"]}`


    row.append(cell0)
    row.append(cell1)
    row.append(cell2)
    row.append(cell3)
    row.append(cell4)
    row.append(cell5)
    row.append(cell6)
    row.append(cell7)
    row.append(cell8)
    row.append(cell9)

    hist_body.append(row)
    History.append(hist_body)




  }

  // activating Jquery data table 
  $(document).ready(function() {
    $.fn.dataTable.ext.errMode = 'none';
    $('#History').DataTable();
  } );  



}

}

}

sumandeb_git@yahoo.co.in

Hostname	Site	Device Type	Model	Status	Deployment ID	Logs	Username	Backup Config	Datetime

sumandeb_git@yahoo.co.in

I guess. may be the datatable is actually getting initiated before table gets filled since its async request.

colin

Please link to a test case as I requested above, it will make debugging possible for us

Colin