Simple DataTables flask

I think there are two things you need to do:

1. Datatables expects the data to be an array of objects. You can read more about the expected data structures here. Your meas needs to be a Python list, for example:

   meas = [{"MeanCurrent": 0.05933, "Temperature": 15.095, "YawAngle": 0.0, "MeanVoltage": 0.67367, "VoltageDC": 3.18309, "PowerSec": 0.06923, "FurlingAngle": -0.2266828184, "WindSpeed": 1.884, "VapourPressure": 1649.25948, "Humidity": 0.4266, "WindSector": 0, "AirDensity": 1.23051, "BarPressure": 1020.259, "time": "2015-04-22 20:58:28", "RPM": 0.0, "ID": 1357}]

2. Datatables, by default, expects the data to be in a data object. You have two options:

Option 1: Return the data in a data object like this:

return jsonify({'data': meas})

Option 2: Use the ajax.dataSrc option to tell Datatables where to find the data, for example:

$('#myTable').DataTable( {    "processing": true,    "ajax": {url: "/page_test",              dataSrc: ""            },    // add column definitions to map your json to the table    .....

http://fb4demo.bitplan.com/datatable has a demo.

It uses https://github.com/WolfgangFahl/pyFlaskBootstrap4 as a library which is built on top of https://github.com/greyli/bootstrap-flask

As a committer of the library i suggest to look at the example which might make your life simpler (at least in the long run after getting aquainted with the base libraries).

E.g.https://github.com/WolfgangFahl/pyFlaskBootstrap4/blob/main/fb4_example/bootstrap_flask/templates/datatable.html

has the template in which the datatable activation is added:

{% block scripts %}    {{ super() }}    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.23/css/jquery.dataTables.css">    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.23/js/jquery.dataTables.js"></script>    <script type="text/javascript">    $(document).ready(function() {        $('.table').DataTable();    });    </script>{% endblock %}

The python code is shortened to:

 def datatable(self):        '''        test data table        '''        icons=BootstrapIcon.query.all()        dictList=[]        for icon in icons:            dictList.append(icon.asDict())        return render_template('datatable.html',listOfDicts=dictList)

You example would need:

    meas = [{"MeanCurrent": 0.05933, "Temperature": 15.095, "YawAngle": 0.0, "MeanVoltage": 0.67367, "VoltageDC": 3.18309, "PowerSec": 0.06923, "FurlingAngle": -0.2266828184, "WindSpeed": 1.884, "VapourPressure": 1649.25948, "Humidity": 0.4266, "WindSector": 0, "AirDensity": 1.23051, "BarPressure": 1020.259, "time": "2015-04-22 20:58:28", "RPM": 0.0, "ID": 1357}   ]

Just add more records with the same dict keys and you'd have a real table.as a listOfDicts and you'd be set.