使用Flask和Ajax将JSON对象返回到View

时间:2014-12-17 15:05:30

标签: python ajax json flask

我正在尝试使用AJAX将一个python字典返回到视图并从JSON文件中读取,但到目前为止我只返回[object Object],[object Object] ...

如果我检查网络流量,我确实可以看到正确的数据。

所以这就是我的代码的样子。我有一个类和一个基于所选ID(请求参数方法)的方法,将打印特定数据。它从python中获取数据。问题不在这里,已经测试过了。但以防万一我将链接它。

#方法创建指示 - 以防万一#

def getCourselist_byClass(self, classid):
        """
        Getting the courselist by the class id, joining the two tables. 
        Will only get data if both of them exist in their main tables.
        Returning as a list.
        """
        connection = db.session.connection()
        querylist = []
        raw_sql = text("""
           SELECT
                course.course_id,
                course.course_name
            FROM
                course
            WHERE
                EXISTS(
                    SELECT 1
                    FROM
                        class_course_identifier
                    WHERE
                        course.course_id = class_course_identifier.course_id
                    AND EXISTS(
                        SELECT 1
                        FROM
                            class
                        WHERE
                            class_course_identifier.class_id = class.class_id
                        AND class.class_id = :classid
                    )
                )""")
        query = connection.engine.execute(raw_sql, {'classid': classid})
        for column in query:
            dict = {
                'course_id'     : column['course_id'],
                'course_name'   : column['course_name']
            }
            querylist.append(dict)

        return querylist

我的jsonify路线方法

@main.route('/task/create_test')
def get_courselist():
    #objects
    course = CourseClass()
    class_id = request.args.get('a',  type=int)    
    #methods
    results = course.getCourselist_byClass(class_id)
    return jsonify(result=results)

HTML

以下是输入字段以及链接数据的位置。

<input type="text" size="5" name="a">
        <span id="result">?</span>
        <p><a href="javascript:void();" id="link">click me</a>

然后我就像这样称呼它

<script type=text/javascript>
    $(function() {
        $('a#link').bind('click', function() {
          $.getJSON("{{ url_for('main.get_courselist') }}", {
            a: $('input[name="a"]').val()
          }, function(data) {
            $("#result").text(data.result);
          });
          return false;
        });
    });
  </script>

但每次我在字段中输入id号码时,我都会收到正确的数据。但格式不正确。而是像[object Object]一样打印它

来源,以此指南为灵感:flask ajax example

2 个答案:

答案 0 :(得分:1)

flask.json.jsonify的API说明表明它期待关键字参数。您真正想要做的似乎是序列化包含字典的列表对象,您是否尝试过flask.json.dumps?假设您已导入dumps符号,而不是jsonify来电,您可以尝试:

return dumps(results)

答案 1 :(得分:1)

服务器返回的数据类似于:{result: [{course_id: 'xxx', course_name: 'xxx'}]},其中data.result是JS数组。

当您将其设置为$("#result").text()时,JS会将数组转换为字符串,因此结果为[object Object]

你应该迭代数组来构造一个字符串,然后在DOM中设置字符串,如:

courseStr = data.result.map(function(course) {return course.course_id + '-' +   course.course_name; }).join(',');
$("#result").text(courseStr);