如何将数据从 Flask 发送到 JavaScript？

Question

您好，我是新手，正在使用 Flask 和 Javascript 构建应用程序。我从 Flask 发送数据时遇到问题 JavaScript.

我在routes.py

中有代码

@app.route('/mapaa',methods=['GET','POST'])
def mapa():
    user_id = current_user.get_id()
    slownik = {}


    if 'event_form' in request.form:
        name = request.form['name_event']
        all_data = Event.query.filter_by(name=name).all()
        for row in all_data:
            date_st_string = str(row.date_start)
            date_end_string = str(row.date_end)
            slownik = {'id':row.id,'date_st':date_st_string,'date_end':date_end_string,'type':row.type,'name':row.name,'len_route':row.len_route,'route':row.route}
        return jsonify(slownik)
    return render_template('mapaa.html', title='Mapa')

我想将 jsonify(slownik) 发送到我在 JavaScript 中的代码，但我不想用 render_template 发送它，因为它会刷新页面并且我需要此数据来显示它使用 JavaScript 的地图。我试过 return jsonify(slownik) 但它 return 我在新页面上的数据。当用户单击 event_form 按钮到 JavaScript 而不刷新页面时，我如何发送数据？

Answer 1

您可以使用 ajax 发送 post 请求而无需刷新页面。注意-在此

之前包括jquery

<script src="https://code.jquery.com/jquery-3.1.0.js" ></script>

javascript代码

$("#id_of_btn").click(function () { // make ajax request on btn click
  $.ajax({
    type: "POST",
    url: "/mapaa", // url to the function
    data: {
      name: $("#id_of_input_tag").val(), // value of the form
    },
    success: function (response) {
      console.log(response); // response contains the json
    },
  });
});

确保您不使用表单标签。

编辑：如果你想通过表单发送更多数据，你可以使用

data: $('form').serialize()

这将获取输入标签的名称属性并将其添加到 request.data 所以如果你有这个

<input type="text" id="element_id" name="username" >

您可以像这样使用 name 属性的值 request.data['username'] 按照这个 tutorial

如何将数据从 Flask 发送到 JavaScript？

How I can send data from Flask to JavaScript?

javascript

python

flask

leaflet