(Flask) Ajax JSON with JQuery-Datatable

0

Good luck.

I'm trying to show my data (JSON) in a Datatable table via Ajax. The HTML is:

        <div class="x_content">
            <table id="exemplo" name="exemplo" class="table table-striped table-bordered">
                <thead>
                    <tr>
                        <th>Data</th>
                        <th>Cred</th>
                        <th>Deb</th>
                        <th>Dsc</th>
                        <th>Valor</th>
                    </tr>
                </thead>
            </table>
        </div>

With the following script running inside HTML:

<script>
    $(document).ready(function(){ 
        $('#exemplo').DataTable({
            "ajax" : '../files/data.json'
            "columns" : [
                { "data" = "data" }
                { "data" = "cred" }
                { "data" = "deb" }
                { "data" = "dsc" }
                { "data" = "valor" } 
            ]
        })
    }   
</script>

As I'm using Flask with the inheritance properties of templates, I use

{% block content %}
{% endblock %}

That pulls the rest of the page from a base.html file. In the base.html file I load the following scripts:

<script src="static/vendors/datatables.net/js/jquery.dataTables.min.js"></script>
<script src="static/vendors/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>
<script src="static/vendors/datatables.net-buttons/js/dataTables.buttons.min.js"></script>
<script src="static/vendors/datatables.net-buttons-bs/js/buttons.bootstrap.min.js"></script>
<script src="static/vendors/datatables.net-buttons/js/buttons.flash.min.js"></script>
<script src="static/vendors/datatables.net-buttons/js/buttons.html5.min.js"></script>
<script src="static/vendors/datatables.net-buttons/js/buttons.print.min.js"></script>
<script src="static/vendors/datatables.net-fixedheader/js/dataTables.fixedHeader.min.js"></script>
<script src="static/vendors/datatables.net-keytable/js/dataTables.keyTable.min.js"></script>
<script src="static/vendors/datatables.net-responsive/js/dataTables.responsive.min.js"></script>
<script src="static/vendors/datatables.net-responsive-bs/js/responsive.bootstrap.js"></script>
<script src="static/vendors/datatables.net-scroller/js/dataTables.scroller.min.js"></script>

However, nothing appears in my table, just the title. Does anyone have any idea what I might be doing wrong? I've read everything I found on the internet, but I can not make the code work ...

I have tried all the codes in the DataTable documentation ( link ), and nothing.

HTML is inside app / templates, and JSON is in the app / files

    
asked by anonymous 20.11.2017 / 17:11

0 answers