时间戳

首页 > 解决方案 > 如何在 Flask 应用程序中对 HTML 表格进行排序？

python - 如何在 Flask 应用程序中对 HTML 表格进行排序？

问题描述

我目前有一个 Flask 应用程序，它从 SQL 服务器读取数据并通过 HTML 表显示它们。我希望能够通过单击相应的列对表格进行排序。如果这是不可能的，那么如何使用 Time 列提前对数据进行排序，然后只显示排序后的表？

这是应用程序：

from flask_sqlalchemy import SQLAlchemy
from sqlalchemy import Table, Column, Integer
from flask import Flask, render_template

app = Flask(__name__)
db = SQLAlchemy(app)

class Orders(db.Model):
    __tablename__ = 'orders'
    OrderID = db.Column(db.Integer(), primary_key=True)
    TableNo = db.Column(db.Integer())
    Item = db.Column(db.String())
    Quantity = db.Column(db.String())
    Number = db.Column(db.String())
    Time = db.Column(db.String())

    def __repr__(self):
        return 'Order: ' + self.OrderID

@app.route("/Orders")
def html():
    orders = Orders.query.all()
    return render_template('Page.html', orders = orders)

if __name__ == "__main__":
    app.run(debug=True)
    html()

这是从 SQL 数据库中读取数据的 html 代码。

<!DOCTYPE html>

<link href="static/style.css?versop" rel="stylesheet" type="text/css"</link>

<h1> AI Waiter <h1>
    <h2> Orders </h2>

    <table>
        <tr>
            <th>OrderID</th>
            <th>TableNo</th>
            <th>Number</th>
            <th>Quantity</th>
            <th>Item</th>
            <th>Time</th>
            <th>Served</th>
        </tr>

    {% for orders in orders %}
    <tr>
        <td>
            {{orders.OrderID}}
        </td>
        <td>
            {{orders.TableNo}}
        </td>
        <td>{{orders.Item}}</td>
        <td>{{orders.Quantity}}</td>
        <td>
            {{orders.Number}}
        </td>
        <td>{{orders.Time}}</td>
        <td>
            <input type="checkbox"><br>
        </td>
    </tr>
    {% endfor %}

    </table>

标签： pythonhtmlflaskflask-sqlalchemy

解决方案

我的方法将是以下步骤：

  1. 将查询结果的主键作为列表发送到主查询旁边的 Jinja 模板，即“订单”。
  2. 将列表传递给控制排序的 JS 函数。
  3. 使用异步请求在单独的路由上将列表发送回 Flask。
  4. 在 Flask 路由功能上，使用 SQLAlchemy 根据主键列表重建查询。
  5. 对查询进行排序。
  6. Jsonify 查询并将其发送回 JS。
  7. 在 JS 上，将原始表格 HTML 替换为新的排序数据。

潜在的问题是，如果您的表非常大，例如大于 1000 行，则重新构建查询可能会触发“SQL 变量过多”错误，我目前没有很好的解决方案。

推荐阅读