Server side data binding with VueJS

mkgn

Datatables work fine until I chose to switch to ServerSide. Currently my server side setup is as below.

        this.dataTable = window.$(this.$el).DataTable({
            data: this.getGridData,
            columns: this.getColumns,
            serverSide: true
        });

Now the data structure I receive from server is an Array of Objects like so;

[
{id=1, name="1", email="email"},
{id=1, name="2", email="email"}...
]

If I straight away assign this to data: I am warned with : http://datatables.net/tn/1 (basically invalid JSON). So If I do a JSON.parse(), I am warned with http://datatables.net/tn/4, which tells me that the columns can't be matched. Then I double checked https://datatables.net/manual/data/ and I don't see any issue in my array of objects either.

If I pass the same data structure by removing "serverSide: true" it all works fine.

What have i done wrong?

colin

Because the data isn't with a data object, you need to set ajax.dataSrc to be ''. Here's an example of it being used,

Colin