如何在没有表单的情况下将 html 数据发送到烧瓶

Question

我知道您可以使用 jquery 中的 $.ajax() 之类的调用轻松地将表单数据发送到烧瓶，但我需要的是一种使用元素（例如 <p> 标记）将数据发送到烧瓶服务器的方法。

例如： 测试.html

<p data-rep='testentry' class='qtemp'>Entry00</p>
<p data-rep='testentry01' class='qtemp'>Entry01</p>

index.js

$(document).ready(function(){
    $('.qtemp').on('click',function(){
        var layout = $(this).data('rep');

        $.ajax({
            url: 'workstation',
            type: 'POST',
            data: layout
        });     
    });
});

main.py

@app.route('/workstation',methods=['GET','POST'])
def workstation(data):
    layout = data

    return render_template('station.html',target=layout)

运行这个应用程序：

1. 不渲染模板station.html
2. 不打印包含已发送数据的layout 变量（我添加了一个打印语句但它不起作用，甚至尝试将其写入文件）

我尝试过的：

1. 在index.js 中，将data: layout 替换为data: JSON.stringify(layout)，然后在.main.py 中，将layout = data 替换为layout = request.args.get('data')。

不用说，这一切都行不通

注意：不能使用 html 表单

Answer 1

您需要修改您的 ajax 以确保您从 Python 路由接收到 JSONified 结果。此外，为了存储从 ajax 调用返回的数据，您必须使用 flask.request.args 按键名访问值：

在index.js:

$(document).ready(function(){
   $('.qtemp').on('click',function(){
    var layout = $(this).data('rep');
     $.ajax({
      url: "/workstation",
      type: "get",
      data: {layout: layout},
      success: function(response) {
        var new_html = response.html;
      },
     });     
  });
});

在main.py:

@app.route('/workstation')
def workstation():
  layout = flask.request.args.get('layout')
  return flask.jsonify({'html':flask.render_template('station.html',target=layout)})

编辑：您可以将从ajax 请求中获得的值存储在flask.session 中，并重定向到所需的页面。为此，创建一个额外的路由来保存该值，然后在 ajax success 函数的主体中使用 window.location.replace：

在index.js:

$(document).ready(function(){
  $('.qtemp').on('click',function(){
    var layout = $(this).data('rep');
    $.ajax({
      url: "/update_layout",
      type: "get",
      data: {layout: layout},
      success: function(response) {
        window.location.replace('/workstation');
      },
    });     
  });
});

在main.py

import string, random

app.secret_key = ''.join(random.choice(string.printable) for _ in range(20))
#secret_key needed for session implementation

@app.route("/update_layout")
def update_layout():
  flask.session['layout'] = flask.request.args.get('layout')
  return flask.jsonify({'success':'True'})

@app.route('/workstation', methods=['GET'])
def workstation():
  return flask.render_template('station.html',target = flask.session['layout'])