buttons extension not loading

buttons extension not loading

capeckcapeck Posts: 49Questions: 12Answers: 1

I am getting the following error when loading buttons extension in a webpack vue app:
Uncaught ReferenceError: jQuery is not defined at line 45 of buttons.datatables.mjs
All the other datatable extensions are working fine. Here are my imports:


import jQuery from "jquery"; window.$ = jQuery import 'datatables.net' import 'datatables.net-bs5' import 'datatables.net-responsive-bs5' import 'datatables.net-responsive' import 'datatables.net-select-bs5' import 'datatables.net-editor-bs5' import 'datatables.net-keytable-bs5' import 'datatables.net-fixedcolumns' import 'datatables.net-editor' import 'datatables.net-editor-bs5' import 'datatables.net-buttons-dt'

If I don't import buttons, I still get Create and Delete showing in editor.

Thanks for any help.

This question has an accepted answers - jump to answer

Answers

  • capeckcapeck Posts: 49Questions: 12Answers: 1
    edited November 2022

    I was able to get an older version of buttons installed that seems to fix the issue. npm was moving buttons to 2.3.2, but if I stick with 2.0.1 it loads.

  • allanallan Posts: 57,737Questions: 1Answers: 9,204 Site admin
    Answer ✓

    Could you try 2.3.3 which I released last yesterday please?

    I suspect, since you mention Webpack, that it is building the Javascript bundle in CommonJS mode. Unfortunately I had an error in the 2.3.[012] release of Buttons that stopped the CommonJS loader from requesting Buttons core when the styling library was imported. Some of the other extensions also had that issue.

    The workaround, if you are on 2.3.2 is to do:

    import 'datatables.net-buttons';
    import 'datatables.net-buttons-bs5';
    

    i.e. import the core before the styling file.

    This isn't an issue with the ES module variants.

    Allan

  • capeckcapeck Posts: 49Questions: 12Answers: 1

    I finally got a chance to try 2.3.3 and same result.
    Here are my imports

    import jQuery from "jquery";
    window.$ = jQuery
    
    import 'bootstrap'
    
    import 'datatables.net'
    import 'datatables.net-bs5'
    
    import 'datatables.net-responsive'
    import 'datatables.net-responsive-bs5'
    
    import 'datatables.net-select'
    import 'datatables.net-keytable'
    import 'datatables.net-editor'
    import 'datatables.net-editor-bs5' 
     
    import 'datatables.net-buttons-dt'    
    import 'datatables.net-buttons-dt/css/buttons.dataTables.css'
    import 'datatables.net-buttons-bs5' 
    
  • allanallan Posts: 57,737Questions: 1Answers: 9,204 Site admin

    Are you able to give me a link to a repo that recreates the issue so I can look into this further please?

    Allan

  • capeckcapeck Posts: 49Questions: 12Answers: 1

    I stepped back and rechecked/rebuilt my app and it seems to be working. I will write that off to a cache not being updated. Thanks for your help .

  • allanallan Posts: 57,737Questions: 1Answers: 9,204 Site admin

    Super - thanks for the update. Good to hear you have it working now!

    Allan

Sign In or Register to comment.