Jquery Datatable warning when adding data: Requested unknown parameter-CodePudding

HTML

<table id='students_grid' class='table table-bordered table-striped' cellpadding='0' cellspacing='0' >
       <thead>
        <tr>
        <th>Student ID</th> /*Hidden*/
        <th>Sr. No.</th>
        <th>Student Name</th>
        <th>Address</th>
        <th>Parent Code</th> /*Hidden*/
        <th>Parent Name</th>                                    
      </tr>
    </thead>
    <tbody>
    </tbody>
</table>

JS Initialisation

$("#students_grid").DataTable({       
"select": {style: 'single'},      
"columnDefs": [
    {
        "data":"studentid",
        "targets": [ 0 ],
        "visible": false,
        "searchable": false
    },
    {
        "data":"parentcode",
        "targets": [ 4 ],
        "visible": false,
        "searchable": false
    }
]
});

Adding data in Table (Called on Button Click)

studenttable = $("#students_grid").DataTable();
studenttable.row.add( [
    $("#studentid").val(),
    $("#srno").val(),
    $("#studentname").val(),            
    $("#address").val(),
    $("#parentcode").val(),
    $("#parentname").text()
]).draw(false);

After the add function is called an warning message is popped up

DataTables warning: table id=students_grid - Requested unknown parameter 'studentid' for row 0, column 0. For more information about this error, please see http://datatables.net/tn/4

Although the row gets added in the table this warning keeps popping up with each addition the row value changes with each addition. How can this warning be avoided?

UPDATE If I remove the "data" declaration from the initialisation it does not give the error message. Can this not be done with the "data" value

CodePudding user response：

The data is missing parameter names so you will see that error if you try to reference it by one.

In addition, you're passing it an array when it is expecting an object for a single row or an array of objects for multiple rows.

studenttable.row.add({
  "studentid": $("#studentid").val(),
  "srno": $("#srno").val(),
  "studentname": $("#studentname").val(),
  "address": $("#address").val(),
  "parentcode": $("#parentcode").val(),
  "parentname": $("#parentname").text()
}).draw(false);