烧瓶渲染模板不适用于 AJAX 帖子答案

【问题标题】：flask render_template doesn't work on AJAX post烧瓶渲染模板不适用于 AJAX 帖子
【发布时间】：2018-06-09 10:48:05
【问题描述】：

我有一个将 AJAX 发布到 Flask 路由的站点。

我知道有很多类似的问题（请不要标记为重复）使用 AJAX 成功方法来处理响应。这在我的简化示例中可以工作，但我实际代码中的路径是从数据库中提取一堆数据，然后渲染到多个表中。我不想用 JavaScript 重写所有的表数据更新，所以我真的只需要重新渲染模板。

蟒蛇：

from flask import Flask, render_template, request
app = Flask(__name__)


@app.route('/', methods=['GET', 'POST'])
def hello_world(message=None):
    return render_template('test.html', message=message)


app.run()

html

<html>
<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

    <script>
        $(document).ready(function () {
            $('#mybutton').click(function () {

                $.post(window.location.href, {'test': 'test'});

            });
        });

    </script>
</head>
<body>
{{ message }}
<button id="mybutton" name="mybutton" type="button">Click Me!</button>
</body>
</html>

【问题讨论】：

标签： javascript jquery python ajax flask

【解决方案1】：

我在很多页面上都在寻找这个问题的答案，但在我找到释放 AJAX 调用以便允许重新呈现的页面之前，它们都没有工作：

$('form').on('submit', function(event) {
   $.ajax({
      type: 'POST',
      url:  "{{ url_for( 'myServerFunction' ) }}",
      data: JSON.stringify({'myId':bunchOfIds}),
      contentType: "application/json",
      success:function(response){ document.write(response); }       
   })

最重要的一行是 success 行，它释放文档以便可以重新渲染。

【讨论】：

【解决方案2】：

好的，你为什么不从你的烧瓶应用程序中发送一个“是或否”标志。由于您想在不刷新页面的情况下显示成功或失败消息，因此当您的烧瓶应用程序返回结果时，让 jquery 更新 DOM。就像是 return message 在您的烧瓶应用程序中可能会起到以下作用 success: function(e)({ $('body').append(e);});。由于我手机上的字长限制，无法生成更多代码，但是沿着我的代码调整你的代码可以完成工作。干杯！

【讨论】：

【解决方案3】：

当您通过 AJAX 发送 POST 请求时，请求来自 javascript，而来自 flask 的响应数据将存储在 Javascript 对象中。浏览器本身不直接发送或接收任何内容，因此不会重新渲染页面。

您需要在 Flask 应用程序中定义另一个端点来为您的 POST 请求返回 json 数据，并使用 AJAX 使用返回的 json 数据来操作 DOM。

【讨论】：

所以基本上没有办法做到这一点？
所以帖子正在提交正在插入数据库的数据。我想保存插入的结果（成功与否）并显示给用户。我可以使用posting.done(function( ) {window.location.replace(window.location.href);}); 重新加载模板，但是存储成功内容的方法是什么，因为在重新加载时会被清除？
不确定清除的东西，这个问题对我来说不清楚。关于通过替换window.location重新加载模板，是不是强制浏览器重新加载页面，从而违背了不重写所有数据的目的？
是的，它确实会重新加载页面。那是想要的状态。我希望重新加载页面，因为我已经编写了以这种方式填充表格的代码。它是基于python的代码。如果我在 AJAX 上成功了，我将不得不用 Javascript 编写所有这些。
我的意思是如果你这样做，浏览器会发送另一个请求，你的后端将不得不再次渲染和返回模板，所以它与将发布部分放入纯没有 javascript 的 html 表单。如果您想使用 javascript，除了发送/接收最少的数据然后操作 DOM 之外，我没有看到任何更有效的解决方案。我可以保证使用 jquery 或任何现代 JS 框架可以实现您想要做的事情。