使用ajax with flask更新表

时间:2013-11-13 22:08:50

标签: jquery python ajax flask

我的网站上有一个页面,其中有两个内容需要大约10秒才能计算出来。我不想让用户等待这么长时间才能加载页面。我想加载没有内容的页面,然后使用ajax发送请求onwindow加载来计算这些内容,然后将它们添加到内容中。在此之前,加载圈是完美的。问题是我之前没有使用过ajax而且我感到迷茫。 编辑1:

我尝试使用jquery和ajax进行实验。我做了一些事情,但我有一个错误。

HTML CODE:

<div id="image" class="span3">
<script type="text/javascript">
    $(function jqueryonload() {
        $.getJSON('/_jqueryonload',{

        "links": {{links}} #links is a jinja variable I pass on render and I want to use it again
        }, 

        function(data) {

          $("#image").html(data.image);

        });
        return false;
        });

        window.onload = jqueryonload;
 </script>

以下是烧瓶代码:

@app.route('/_jqueryonload')
def jqueryonload():

    links = request.args.get('links')
    image_v = image_def(links) # this is a function that find the link of the image

    image = '''<img src="%s"/>''' % (image_v)

    return jsonify(image=image)

我不知道问题是什么,但图像根本没有显示:(

1 个答案:

答案 0 :(得分:0)

您显然没有将任务对象传递给模板,这就是您无法使用它的原因。我没有使用过烧瓶,但你可能会以tasklinks作为一个字典而离开。

return render_template("task_details.html", {'links': links, 'task': task))

这是一个使用bottlepy和ajax的例子,非常类似于flask

ajax电话:

$.ajax(url: '/methods/12',
type: json, 
data: somedata,
success: function(result){
alert(result);
});

蟒:

@route('/methods/<id>', method='GET')
def getUserStatus(id='0'):
    # Get user status info
    try:

        con = pymysql.connect(user=dbUser, passwd=password, host=dbHost, port = dbPort, db=database)
        cursor = con.cursor()
        status = cursor.execute("SELECT account_number,account_type FROM payment_methods")
        status = cursor.fetchall()
        con.close()
    # handle mysql errors   
    except pymysql.Error as error2:
        message = ({"result":"error","error_name":error2[1]})
        return json.dumps(message)
    # Preparing response
    q = len(status)
    columns = zip(*status)
    acc_n  =columns[0]
    acc_t = columns[1]
    #acc_n = [x for (x,y) in status]
    #acc_t = [y for (x,y) in status]
    message = ({"result":"OK","q":q,"acc":acc_n,"name":acc_t})
    # Return
    return json.dumps(message)