在jQuery AJAX请求到Flas之后呈现Jinja

Question

我有一个web应用程序，当HTML中的select元素发生更改时，它从Flask获取动态数据。当然，这是通过jquery ajax完成的。没问题，我明白了。

问题是，Flask-发送的动态数据是来自数据库Flask sqlalchemy的对象列表。

当然，数据是以JSON格式从Flask发送的。

我想遍历这些对象，使用Jinja显示它们的信息。

HTML格式

<select id="#mySelect">
    <option value="option1" id="1">Option 1 </option>
    <option value="option2" id="1">Option 2 </option> 
    <option value="option3" id="3">Option 3 </option>
</select>

jQuery公司

$('body').on('change','#mySelect',function(){
   var option_id = $('#mySelect').find(':selected').attr('id');
   $.ajax({
     url: "{{ url_for('_get_content') }}",
     type: "POST",
     dataType: "json",
     data: {'option_id':option_id},
     success: function(data){
       data = data.data;
      /* HERE I WANT TO ITERATE THROUGH THE data LIST OF OBJECTS */
     }

   });
});

烧瓶

@app.route('/_get_content/')
def _get_content():
    option_id = request.form['option_id']
    all_options = models.Content.query.filter_by(id=option_id)
    return jsonify({'data': all_options})

PS：我知道jinja首先被呈现，所以没有办法将jQuery变量分配给jinja。如果我不能在Jinja中使用数据列表，那么我到底该如何遍历它呢？

Answer 1

好吧，我明白了。

简单地说，我制作了一个外部的html文件，并向其中添加了所需的jinja模板。

{% for object in object_list %}
   {{object.name}}
{% endfor %}

然后在我的Flask文件中，我确实返回了render_模板对jquery的响应（其中包含我想要附加的HTML）

objects_from_db = getAllObjects()
return jsonify({'data': render_template('the_temp.html', object_list=objects_from_db)}

然后简单地将响应中的HTML附加到需要更新的div中。

Answer 2

如果使用json发送数据，则不需要使用Jinja2。你可以试试这样的方法：

@app.route('/_get_content/')
def _get_content():
    option_id = request.form['option_id']
    all_options = models.Content.query.filter_by(id=option_id)
    return jsonify({'data': [option.name for option in all_options]})

或者在模型中定义一个方法，比如to_json，它返回一个字段或字典，或者。。。在你看来就是这样。

@app.route('/_get_content/')
def _get_content():
    option_id = request.form['option_id']
    all_options = models.Content.query.filter_by(id=option_id)
    return jsonify({'data': [option.to_json() for option in all_options]})