时间戳

首页 > 解决方案 > 将元组的python列表发送到JavaScript数组不起作用

javascript - 将元组的python列表发送到JavaScript数组不起作用

问题描述

我正在尝试将元组的 python 列表发送到 javascript 数组，但由于某种原因，它不起作用。

蟒蛇代码

import json
app = Flask(__name__)
@app.route('/', methods=['GET', 'POST'])
def stock_table():
    if request.method == "POST":

        data = [('abc','efg','hij', "klm"), ('nop','qrs','tuv', "wxyz")]
        string_data="'"
        string_data+=str(json.dumps(data))
        string_data+="'"
        return render_template('index.html', result=string_data)
    
    else:
        return render_template('index.html')

if __name__ == '__main__':
app.run()

string_data出来为： '[["abc", "efg", "hij", "klm"], ["nop", "qrs", "tuv", "wxyz"]]'

javascript代码

<!DOCTYPE html>
<html>
<body>
    <h3> Show stock pie graph </h3>
    <form action="{{ url_for('stock_table') }}" method="post">
        Enter User Name:  <input type = "text" name= "user_name" />
            <input type="submit"  value="Go!">
            <p id="result"></p>

            
    </form>

    <script> 
    var array_start ="{{ result }}";
    arrayOfArrays = JSON.parse(array_start);
    document.getElementById("result").innerHTML = arrayOfArrays;
    </script>

</body>
</html>

当我运行程序时，它不会显示任何错误，但不会显示结果。

我还尝试使用我在javascript中制作的字符串，只需复制它就可以了！

我认为问题在于，当元组中包含一个字符串时，JSON.parse 函数不适用于我从 python 发送的数据，而当它只是数字时它工作得很好。

任何帮助，将不胜感激！

标签： javascriptpythonarraysjsonflask

解决方案

我不确定你在做什么。

您可以使用jinja2 过滤器将数据转换为符合 JSON 标准的字符串。注意引号也很重要。

@app.route('/', methods=['GET', 'POST'])
def stock_table():
    data = []
    if request.method == "POST":
        data = [('abc','efg','hij', 'klm'), ('nop','qrs','tuv', 'wxyz')]
    return render_template('index.html', data=data)

<p id="output">{{ data | tojson | safe }}</p>
<p id="result"><p>
<script type="text/javascript">
  const data = '{{ data | tojson | safe }}';
  console.log(JSON.parse(data));

  document.getElementById('result').innerHTML = data;
</script>

如果你想使用 AJAX，你可以在你的路由中使用jsonify来响应 JSON 格式的结果。你可以在这里找到一个例子。可能您应该在那里使用表单的提交事件。

推荐阅读