how to load datatables.js and datatables.responsive.js using requirejs

clintwilde

I have looked at various forum posts, but I still cannot get the responsive and datatables to load when I include both modules.

I can get the datatables only to load just fine, but when I try to load them both, the html in the browser is not showing the dataatable styles, even though both files are loaded in the network tab in my Chrome developer tools.

My config.js looks like this:

__CONFIG__.paths.jquery = '/o/documentsmediacategorizationportlet/js/jquery-3.1.1.min.js';

Loader.addModule({
    dependencies: ['jquery'],
    name: 'datatables.net',
    path: '/o/documentsmediacategorizationportlet/js/jquery.dataTables.js'
});

Loader.addModule({
    dependencies: ['datatables.net'],
    name: 'dataTables.responsive',
    path: '/o/documentsmediacategorizationportlet/js/dataTables.responsive.js'
});

my jsp file:

<aui:script>
    require(['jquery','dataTables'], function($, dataTables) {
        
        $(document).ready(function() {

            $('#<portlet:namespace/>all_documents').dataTable({
                "order": [],
                "columnDefs": [ {
                  "targets"  : 'no-sort',
                  "orderable": false,
                }]              
            });
        });
    });
</aui:script>

note, i also tried: require(['jquery','dataTables.net']... (.net) added, but that did not help.

Thanks in advance for your help.
Clint