Cannot reinitialise DataTable

mikeD123

i tried all the options i could find but could not resolve my reinitialise error.
i'm initializing table in success of jquery ajax call triggered by button click.

table works but if i click button again i get reinitialise message.

• retrieve:true
• destroy()
• paging:false , search:false

is it because i'm putting table in var?

DataTables warning: table id=xtrTable - Cannot reinitialise DataTable. For more information about this error, please see http://datatables.net/tn/3

success: function (Response) {
var dataSet = Response;
console.log("success" + dataSet);
var table = $('#xtrTable').DataTable({
retrieve: true,
data: dataSet,
mDataProp: "",
autofill: true,
// destroy: true,
paging: false,
searching: false,
dataType: "json",
defaultContent: " ",
bFilter: false,
fixedHeader: true,
lengthChange: false,
pageLength: 50,
className: 'dt-body-center',
options: [
{ label: "", value: "True" }
],
aoColumnDefs: [{

                    targets: 0,
                    orderable: false,
                    className: 'select-checkbox'

                }],

                dom: 'Bfrtip',
                buttons: [
                    'selectAll',
                    'selectNone'
                ],
                select: {
                    // style: 'os',
                    selector: 'td:first-child',
                },
                order: [[1, 'asc']],
                aoColumns: [
                    {
                        'render': function (data, type, full, meta) {
                            return '<input type="checkbox" name="id[]" value="'
                                + $('<div/>').text(data).html() + '">';
                        }
                    },
                    { mData: "REQUISITION" },

                    // {
                    //     "mData": null,
                    //     "mRender": function (data, type, data) {

                    //         return data['PFIRST'] + ', ' + data['city'] + ', ' + data['PLAST'];
                    //     }
                    // },


                    { mData: "PLAST" },
                    { mData: "PFIRST" },
                    {
                        mData: "PMIDDLE",
                        defaultContent: " "
                    },
                    { mData: "CURR_INS" },
                    { mData: "DOS" },
                    { mData: "SRCFAC" },
                    { mData: "TRAC_ID" },
                    { mData: "CONTRACTCODE" },
                    { mData: "BALANCE" }
                ]
            });
            $('#xtrTable-select-all').on('click', function () {
                // Check/uncheck all checkboxes in the table
                var rows = table.rows({ 'search': 'applied' }).nodes();
                $('input[type="checkbox"]', rows).prop('checked', this.checked);

            });

allan

is it because i'm putting table in var?

No - its because each time your Ajax request completes you are initialising the whole table again. Rather than doing that, just initialise it once (before the Ajax call) and then use the API to populate the data into it - e.g. clear() and rows.add().

Allan