[Vuejs]-“Cannot read property 'ajax of undefined”

by

0👍

✅

Just create a reactive property and assign your DataTable to it.

data: {
    appTable: null
}

or if it’s a component, use function instead

data: function() {
    return {
        appTable: null
    }
}

More about data property you can read here: https://v2.vuejs.org/v2/guide/instance.html#Data-and-Methods

In your init method you should replace appTable = $('#tblApproval').DataTable with this.appTable = $('#tblApproval').DataTable. And in your search method appTable.ajax.reload(); to

if(this.appTable) {
    this.appTable.ajax.reload();
}
else {
    console.log('The data table was not loaded!');
}

Also, it’s obvious, that your init function should be initialized before you call a search. May be you should place it in created hook if you didn’t already.

created: function() {
    this.init();
}

More about lifecycle hooks you can read here: https://v2.vuejs.org/v2/guide/instance.html#Instance-Lifecycle-Hooks

Leave a comment