DataTables.js Requested unknown parameter when adding row

Question

I have a predefined datatable on my page that is populating from data with an ajax call. After these values are on the page the user needs an ability to add rows by clicking a button, kind of like an audit log. However, every time I go to add a row I get the error

"DataTables warning: table id=DataTables_Table_0 - Requested unknown parameter 'data1' for row 2, column 0."

I have been up and down the internet and cannot figure this out. Help please.

I have the table variable defined globally so everyone has access to it

var escalationTable;

and then a function that calls my ajax to populate said table.

 function populateTable(var1, var2, var3, var4, var5, var6, var7) {
            $.ajax({
                dataType: 'json',
                //data: id,
                type: 'GET',
                async: false,
                url: baseUrl + 'rest/partUrl/action?var1=' + var1 + '&var2=' + var2 + '&var3=' + var3 + '&var4=' + var4,
                success: function (data) {
                    if (data) {


                        escalationTable = $('.escalationTable').DataTable({
                            data: data,
                            columns: [
                                {
                                    data: "data1" ? "data1" : null
                    },
                                {
                                    data: "data2" ? "data2" : null

                    }, {
                                    data: "data3" ? "data3" : null
                    }
                ],
                            bSort: false
                        });



                    }
                },
                error: function (request, status, error) {
                    showErrorMessage(request);
                }
            });
        }

html

<table class="table escalationTable col-md-12" style="width:100%;">
                                                                <thead>
                                                                    <tr>
                                                                        <th name='esId' scope="col">#</th>
                                                                        <th name='esUser' scope="col">User</th>
                                                                        <th name='esDate' scope="col">Date</th>
                                                                    </tr>
                                                                </thead>
                                                                <tbody>
                                                                </tbody>
                                                            </table>

and then my click looks like this

$('.assignToSelf').on('click', function () {
        var rowNode = escalationTable
            .row.add({
                "esId": 'ffffff',
                "esUser": 'dfsdfsdf',
                "esDate": 'fffff'
            })
            .draw(false)
            .node();

    })

It produces this error if the data source object for the row had no esId parameter or the data was null or undefined (from documentation ) You should check both clues.. — bigless
– bigless, Commented Jan 8, 2018 at 21:52
@bigless I have read the documentation. I am passing string values...so that shouldn't be the issue unless I'm missing something. — zazvorniki
– zazvorniki, Commented Jan 8, 2018 at 21:54
@MuhammadOmerAslam added html. It's a basic table....nothing special. — zazvorniki
– zazvorniki, Commented Jan 8, 2018 at 22:07
just wanted to see the exact number of columns in the header, so tell me what is data1, data2 and data3 as you are defining the columns for the table the following way data: "data1" ? "data1" : null which will evaluate to data:data1 always, and that is where it is raising the exception why are you doing this,is that even valid ? @zazvorniki — Muhammad Omer Aslam
– Muhammad Omer Aslam, Commented Jan 8, 2018 at 22:22

zazvorniki · Accepted Answer · 2018-01-09 14:55:56Z

1

The answer to this question would be naming the fields in the add the same as the data that is going into the field. Not based on the name of the field.

$('.assignToSelf').on('click', function () {
        var rowNode = escalationTable
            .row.add({
                "data1": 'ffffff',
                "data2": 'dfsdfsdf',
                "data3": 'fffff'
            })
            .draw(false)
            .node();

    })

answered Jan 9, 2018 at 14:55

zazvorniki

3,62023 gold badges80 silver badges128 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

DataTables.js Requested unknown parameter when adding row

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related