Symfony 5 + Webpack Encore + Bootstrap Table not exporting

I am trying to add an exportable Bootstrap Table for each entity. But the export button is being displayed but still, it has no action while clicking over it.

I thought this could be some library issue but I guess the error is in my code.

Since its installation documentation is not "big" I will write the steps I followed:

  1. Ran yarn add bootstrap-table

  2. Added jQuery and other table export libraries inside /assets/app.js:

    import '../css/app.scss';
    import $ from 'jquery';
    global.$ = global.jQuery = $;
    
    import 'bootstrap';
    import './tableExport.min.js';
    import 'bootstrap-table';
    import './bootstrap-table-export.min.js';
    import './bootstrap-table-locale-es.js';
    
    import '@fortawesome/fontawesome-free/css/all.min.css';
    import '@fortawesome/fontawesome-free/js/all.js';
    
    
    console.log('Webpack compilado');
    
  3. To avoid some errors, this might be redundant with the previous step, I added jquery as a global variable to webpack.config.js:

    .autoProvidejQuery()
    .autoProvideVariables({
        $: 'jquery',
        jQuery: 'jquery',
        'window.jQuery': 'jquery',
    })
    
  4. Added the HTML to the template: <table class="table"></table>

  5. Added the JavaScript to the template:

    $('.table').bootstrapTable({
             columns: [
                 {% block jsTableColumns %}{% endblock %},
                 {
                     field: 'show',
                     title: 'Acciones',
                     formatter,
                     align: 'center'
                 }
             ],
             showExport: true,
             search: true,
             url: '/api/{% block jsApi %}{% endblock %}.json',
             pagination: true,
             {% block jsTableOptions %}{% endblock %}
         })
    

What am I missing?

Source: Symfony Questions

Was this helpful?

0 / 0

Leave a Reply 0

Your email address will not be published. Required fields are marked *