Reusing a Config for multiple DT across the website

Reusing a Config for multiple DT across the website

timcadieuxtimcadieux Posts: 76Questions: 22Answers: 0

I'd like to reduce the amount of config I have to add the DT on each page therefore I have added a DTConfig() function in my site.js which would load for every page.

The below seems to work so far but I'd like to also add some additional config options which are stumping me...

I'd like to reuse much of the below..any suggestions are appreciated.

 function Table() {

            var table = $('#Table');

            table.DataTable({
                language: {
                    'url': 'https://cdn.datatables.net/plug-ins/1.10.20/i18n/' + i18n + '.json'
                },
                // Pagination settings
                dom: "<'row'<'col-sm-6 text-left'B><'col-sm-6 text-right'f>>\
                        <'row'<'col-sm-12'tr>>\ <'row mb-2'<'col-sm-12 col-md-5'i><'col-sm-12 dataTables_pager'lp>>",
                buttons: {
                    buttons: [
                        { extend: 'excelHtml5', className: 'btn btn-outline-secondary' },
                        { extend: 'csvHtml5', className: 'btn btn-outline-secondary mx-2' },
                        { extend: 'pdfHtml5', className: 'btn btn-outline-secondary' }
                    ],
                    dom: {
                        button: {
                            className: 'btn'
                        }
                    }
                },
                columnDefs: [
                    { width: '5%', 'targets': [0] }
                ]
            });

        }
function DTConfig() {

    $('#Table').on('preXhr.dt', function (e, settings, data) {
        data.from = data.start;
        data.take = data.length;
    });

    $('#Table').on('xhr.dt', function (e, settings, json, xhr) {
        var total = xhr.getResponseHeader('total');
        json.recordsTotal = total;
        json.recordsFiltered = total;
    });

    $('#export_excel').on('click', function (e) {
        e.preventDefault();
        table.button(0).trigger();
    });

    $('#export_csv').on('click', function (e) {
        e.preventDefault();
        table.button(1).trigger();
    });

    $('#export_pdf').on('click', function (e) {
        e.preventDefault();
        table.button(2).trigger();
    });
}

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 21,341Questions: 26Answers: 4,954
    Answer ✓

    The below seems to work so far but I'd like to also add some additional config options which are stumping me...

    Maybe you can provide more details of the problems. Better is a test case so we can see what your environment looks like.

    You can set defaults as document here:
    https://datatables.net/manual/options#Setting-defaults

    Kevin

  • timcadieuxtimcadieux Posts: 76Questions: 22Answers: 0

    The above option is exactly what I needed, thanks!

This discussion has been closed.