服务器端处理数据表和烧瓶

Question

我想在我的Flask应用中使用来自sqlite的数据实现服务器端处理。我是一个新手，所以我无法弄清楚什么是错的。到目前为止，我已经来到了这个：

HTML：

<table id="myTable" class="table table-striped" style="width:100%" > 
      <thead> 
       <tr> 
      <th>Time</th> 
      <th>Mean Current</th> 
      <th>Vapour Pressure</th> 
      <th>Mean Voltage</th> 
      <th>Temperature</th> 
      <th>Humidity</th> 
      <th>Bar Pressure</th> 
      <th>RPM</th> 
      <th>Wind Sector</th> 
      <th>Wind Speed</th> 
      <th>Air Density</th> 
      <th>DC Voltage</th> 
      <th>Power Sector</th> 
      <th>Furling Angle</th> 
      <th>Yaw angle</th> 
      </tr> 
     </thead> 
      </table> 

的Javascript：

$(document).ready(function() { 
    $('#myTable').DataTable({ 
     "processing": true, 
     "serverSide": true, 
     "ajax": "/page_test" 
    }); 
}); 

视图功能：

@app.route('/page_test') 
def page_test(): 
    data = json.dumps(meas[2]) 
    print data 
    return data 

MEAS [2]是我的字典：

[dict((c.description[i][0], value) \ 
       for i, value in enumerate(row)) for row in c.fetchall()] 

在 “打印数据” 一切打印精细，这样的：

{ “MeanCurrent”：0.05933， “温度”：15.095， “YawAngle”：0.0 “MeanVoltage”：0.67367， “电压DC”：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}这个乘以行数

但是，当我运行应用程序并插入查询时，表格只显示“th”标签，并且在表格的顶部写有“Processing ...”，但没有显示数据。在我的烧瓶应用程序的终端，则显示一个巨大的字符串，这是一个小样品：

/page_test绘制= 2分&列％5B0％5D％5Bdata％5D = 0 &列％5B0％5D％5Bname ％5D = &列％5B0％5D％5B可采集％5D = true &列％5B0％5D％5B可订正％5D =真&列％5B0％5D％5B搜索％5D％5B值％5D = &列％5B0％5D％5B搜索％5D％5Bregex％5D =假&列％5B1％5D％5Bdata％5D = 1分&列％5B1％5D％5Bname％5D = &列％5B1％5D％5Bsearchable％5

，这里是一个屏幕截图：

每次点击th标签时，都会再次出现相同的字符串。看起来我错过了一些重要的东西，但由于这是我的第一个应用程序，我无法弄清楚它是什么。任何建议修改代码将不胜感激。

Answer 1

Server-side processing是一种设置，需要您拥有一个数据库脚本，能够在您自己的服务器/数据库上复制DataTables的许多核心功能，以管理非常大的数据集。

传递给脚本的所有信息（例如，那些长信息）是您需要用来查询数据库以返回DataTables呈现结果的输入。

如果你希望数据表，从您的水壶终端加载的数据，然后管理所有的处理在内部进行修改：删除serverSide设置，让你的数据在正确的地方结束了加列配置：

的Javascript：

$(document).ready(function() { 
    $('#myTable').DataTable({ 
     "processing": true, 
     "ajax": "/page_test", 
     // add column definitions to map your json to the table 
     "columns": [ 
      {data: "time"}, 
      {data: "MeanCurrent"}, 
      ... 
     ] 
    }); 
}); 

DataTable Initialization Options：如果单击“列”按钮，它可以显示各种配置的每个“列”接受，无论是排序，订购，定制的渲染，等等...

的Python：

from flask import jsonify 

@app.route('/page_test') 
def page_test(): 
    return jsonify(meas[2])