String exists but getting warning "Requested unknown parameter"...

xanabobana

Link to test case: https://dev.vmc.w3.uvm.edu/xana/climateIndicators/subCatPage/1/1/1
Debugger code (debug.datatables.net): opexec
Error messages shown: DataTables warning: table id=subCatTable - Requested unknown parameter 'states' for row 1, column 4. For more information about this error, please see http://datatables.net/tn/4
Description of problem:

I am getting the above error which I have read about on the given link. It's strange because the "states" variable in the error is rendering properly on the table. So I'm not sure why this error continues to show? Here is my code:

 //define subCat page datatable
      var subCatTable = $('#subCatTable').DataTable({
        "columnDefs": [
            {
                "targets": 0,
                "createdCell": function (cell, cellData, rowData, rowIndex, colIndex) {
                    var html = "<input type ='checkbox' class='project-select-ckbx' id='" + rowData.studyID + "'>"
                    $(cell).html(html)
                }
            },
            {"targets": 2,
                "orderable": true,
                "createdCell": function (cell, cellData, rowData, rowIndex, colIndex) {
                    $(cell).html('<a href="#studyinfo" data-toggle="modal" data-target="#studyModal" class="viewstudy color__green font__semibold" value="'+rowData.studyID+'">'+cellData+'</a>')
                }
            },
            {"targets": 7,
                "visible": false,                
            }
            ],
        "data": tableInfo,
        "columns": [
            {data: null,
                orderable: false,
            },
            {data: 'studyID',
                orderable: true
            },
            {data: 'title',
                orderable: true
            },
            {data: 'years[]',
                render: function ( data , row ) {
                  var output='';
                   $.each(data, function(index,item) {
                    output+= '<p>'+data[index].startYr+'-'+data[index].endYr+'</p>';
                  });
                    return output;
               }
            },
            {data: 'states' },
            {data: 'indicators.metrics',
             render: "[, ]"
            },
            {data: 'studyID'},
            {data: 'indicators.ciSubCats'}
        ]
   });

And the data that I've logged to the console:

contact: {name: "Wes Ashe", email: "mailto:wes@difw.maine.gov", phone: "800-555-1212"}
desc: "A long-term brook trout (Salvelinus fontinalis) stream monitoring (TSM) projection initiated in 1990 in order to assess brook trout populations in select Maine streams and to determine the effects of a change in the general law bag limit. Seven long-term index sites were chosen for the TSM and many additional streams were also chosen for shorter-term monitoring through the project's duration (1990-2014)."
indicators: {ecoSysCategory: "Aquatic Systems", ciCats: Array(1), ciSubCats: Array(1), metrics: Array(2)}
org: {name: "Maine Department of Inland Fisheries and Wildlife; Fisheries and Hatcheries Division", url: "https://www.maine.gov/ifw"}
states: "ME, NH"
studyID: 1
title: "Maine's brook trout stream monitoring project: trends in abundance and size quality of stream-dwelling brook trout"
years: [{…}]
__proto__: Object

kthorngren

As described in the data docs the row data needs to be in an array even if its just one row. It looks like your data is a single object.

Kevin

xanabobana

It is in an array. I just didn't know how to copy the data from the console showing that. If you look at the table, all of the other data is displaying fine. For example, the "title" string displays without a problem.

kthorngren

Your first row has "states": "ME, NH", but your second has "state": "VT, NY",. Looks like a typo for the second row.

Kevin

xanabobana

Yes! That was it, thank you so much!