$ .ajax邮政请求瓶上的错误请求(400)

时间:2015-01-12 14:44:10

标签: ajax forms post flask httprequest

对于我在Flask中的web应用程序,我需要在一个提交中发送两个帖子请求:

第一个是发送我的表单数据,这里一切正常。

但是有一个字段无法通过表单发送(Tag-Field)。所以我想通过javascript获取此字段的标记,然后使用$ .ajax发布请求将其发送到我的视图。 每次单击提交按钮时,我都会收到$ .ajax发布请求的错误请求(400)错误。 另一个帖子请求正常。

这是我的javascript:

script language="javascript">
    function getTagList() {
        var tagArray = new Array();
        tagArray = $('#my-tag-list5').tags().getTags();
        var tags = tagArray.toString();
        console.log(tags);
        request = $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            url: "/dozent/fragenEingeben",
            data: JSON.stringify(tags),
            success: function (data) {
                console.log(data.tags);
            },
        });
    }
</script>

调用脚本和表单提交的按钮如下所示:

<li class="next"><button type="submit" class="btn btn-success next btnPager btnPagerRight" name="createAndActivate" value="createAndActivate" onclick="getTagList();">Speichern</br><i>~ und freigeben ~</i></button></li>

当我在Flask中打印request.form时,我在Python控制台中得到了这个:

ImmutableMultiDict([])
127.0.0.1 - - [12/Jan/2015 15:25:09] "POST /dozent/fragenEingeben HTTP/1.1" 400 -
ImmutableMultiDict([('createAndActivate', u'createAndActivate'), ('option2[]', u'answer1'), ('option2[]', u'answer2'), ('option2[]', u'answer3'), ('option2[]', u''), ('option[]', u'answer'), ('option[]', u''), ('question', u'Question'), ('time', u'10s')])
127.0.0.1 - - [12/Jan/2015 15:25:10] "POST /dozent/fragenEingeben HTTP/1.1" 302 -

这是我的webbrowser中的错误:

POST http://127.0.0.1:5000/dozent/fragenEingeben 400 (BAD REQUEST)      jquery.min.js:4
  send                                                                  jquery.min.js:4 
  m.extend.ajax                                                         jquery.min.js:4
  getTagList                                                            fragenEingeben:240
  onclick                                                               fragenEingeben:227 

这是我的观点:

#create question
@app.route('/dozent/fragenEingeben', methods=['GET','POST'])
@login_required
def fragenEingeben():
    if request.method == 'POST':
        print request.form
        #If button "Speichern und freigeben" was clicked do the following
        if request.form['createAndActivate'] == 'createAndActivate':
            tags = request.json['tags']
            #Get ID of signed in lecturer
            lecturer = getLecturerID((session['email'],))
            #Write all in db
            createAndActivateQuestion(request.form['question'],"tag",lecturer,request.form['time'],request.form.getlist('option[]'),request.form.getlist('option2[]'))
            flash('Frage erfolgreich erstellt und aktiviert.')
            return jsonify(tags=tags)
        #If button "Speichern und nicht freigeben" was clicked do the following
        elif request.form['createQuestion'] == 'createQuestion':
            #Get ID of signed in lecturer
            lecturer = getLecturerID((session['email'],))
            #Write all in db
            createQuestion(request.form['question'],"tag",lecturer,request.form['time'],request.form.getlist('option[]'),request.form.getlist('option2[]'))
            flash('Frage erfolgreich erstellt.')
            return redirect(url_for('fragenEingeben'))
        else:
            return redirect(url_for('statistik'))
    else:
        pass
    return render_template('dozent/fragenEingeben.html')

当我想在视图中获取数据时,我收到以下错误:

TypeError: 'NoneType' object has no attribute '__getitem__'

任何人都可以解释为什么我收到第一个帖子请求的错误请求?

1 个答案:

答案 0 :(得分:1)

在表单发布之前,单独执行 。发送AJAX调用时,您无法使用request.form,因为尚未发送数据。而是在AJAX请求之后的单独请求中发送它。

如果要包含标签是表单POST,请将它们放在<input type="hidden">字段中,而不是使用AJAX。 AJAX用于带外请求,而不是用于向现有表单POST添加数据。

因此,不要使用$.ajax而是在表单中添加额外的表单字段:

<input type="hidden" name="tag_list" id="tag_list" value="" />

并在您的提交事件处理程序中更新该字段:

tagArray = $('#my-tag-list5').tags().getTags();
$('#tag_list').val(JSON.stringify(tagArray));

并在Flask视图中提取这些标记:

import json

tags = json.loads(request.form['tag_list']))