Can someone explain this error?

Can someone explain this error?

abickfordabickford Posts: 15Questions: 5Answers: 0

I am running into an error I don't understand. Below is the error message and trace:

datatables.min.js:71 Uncaught (in promise) TypeError: Cannot set properties of undefined (setting 'nTf')
    at Jb (datatables.min.js:71:305)
    at Aa (datatables.min.js:93:175)
    at f (datatables.min.js:142:112)
    at HTMLTableElement.<anonymous> (datatables.min.js:142:198)
    at Function.each (datatables.min.js:14:3003)
    at S.fn.init.each (datatables.min.js:14:1481)
    at S.fn.init.u [as dataTable] (datatables.min.js:132:187)
    at l.fn.DataTable (datatables.min.js:222:482)
    at DTtab (profile.js:818:11)
    at growth_tab (profile.js:428:1)
Jb @ datatables.min.js:71
Aa @ datatables.min.js:93
f @ datatables.min.js:142
(anonymous) @ datatables.min.js:142
each @ datatables.min.js:14
each @ datatables.min.js:14
u @ datatables.min.js:132
l.fn.DataTable @ datatables.min.js:222
DTtab @ profile.js:818
growth_tab @ profile.js:428
(anonymous) @ profile.js:5374
Promise.then (async)
genSel2display @ profile.js:5250
(anonymous) @ profile.js:3521
Promise.then (async)
genProfile @ profile.js:3496
changeContent @ profile.html:297

The "DTtab" is a general data table production function I wrote. This function works elsewhere in my program, and the code that produces the error outputs a data table. The issue I am having can be seen here:

    //selecting initial dropdown values
  $("#tabSelect1 option[value='1']").prop("selected", true);

   var dd1 = document.getElementById("tabSelect1");
   var btndown = document.getElementById("increment11");
   var btnup = document.getElementById("increment21");

DTtab("tabDiv1",tab_gr,tabVal,row_labels,ftrString,tblfoot,"popgrowth",fileName,tabtitle) 
  
  dd1.addEventListener('change', function() {
       if(dd1.value == "0") {
           DTtab("tabDiv1",tab_gr,tabVal,row_labels,ftrString,tblfoot,"popgrowth",fileName,tabtitle);
       } else {
           DTtab("tabDiv1",tab_pop,tabVal,row_labels,ftrString,tblfoot,"popgrowth",fileName,tabtitle);
       }
   });

   btndown.addEventListener('click', function() {
     tabVal = tabVal - 1;
     if(tabVal < 0) {
        tabVal = 5
     }
     if(dd1.value == "0") {
           DTtab("tabDiv1",tab_gr,tabVal,row_labels,ftrString,tblfoot,"popgrowth",fileName,tabtitle);
       } else {
           DTtab("tabDiv1",tab_pop,tabVal,row_labels,ftrString,tblfoot,"popgrowth",fileName,tabtitle);
      }
   });
  btnup.addEventListener('click', function() {
     tabVal = tabVal + 1;
     if(tabVal > 5) {
        tabVal = 0
     }
     if(dd1.value == "0") {
           DTtab("tabDiv1",tab_gr,tabVal,row_labels,ftrString,tblfoot,"popgrowth",fileName,tabtitle);
       } else {
           DTtab("tabDiv1",tab_pop,tabVal,row_labels,ftrString,tblfoot,"popgrowth",fileName,tabtitle);
      }
    });

The page objects (dd1, increment11, increment12) are in the DOM, and they are unique to the page. However, I get this error and cannot use the dom elements to change the table.

My first question is what is this "Cannot set properties of undefined (setting 'nTf')" referring to?
TIA
AB

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 20,141Questions: 26Answers: 4,736

    My first question is what is this "Cannot set properties of undefined (setting 'nTf')" referring to?

    I'm not sure but maybe Allan knows. For testing change the datatables.min.js you are loading to the non-minified version and you will get more details. However that might not be too useful.

    The thing to do would be to place debugger breakpoints in profile.js at the lines noted in the traceback. Maybe start at genProfile @ profile.js:3496 and step through the code to find what is undefined. ITs hard to say from code snippets what might be undefined but with the debugger you should be able to find it. Then debug from there why there is something undefined causing the error. I suspect the problem is not something in Datatables. There are tutorials on the internet with techniques to debug undefined variables.

    Kevin

  • allanallan Posts: 61,439Questions: 1Answers: 10,053 Site admin
    Answer ✓

    It is something to do with the table footer and it not relating to the structure of the host table. Can you show us the HTML for your table please?

    Allan

  • abickfordabickford Posts: 15Questions: 5Answers: 0

    Thanks for the solution. The colspan parameter in my table footer was picking up the wrong value.
    All is well.
    Cheers--
    AB

Sign In or Register to comment.