web-dev-qa-db-ja.com

JqueryajaxPOSTリクエストが機能しない

Ajaxを使用した単純なフォーム送信がありますが、エラーが発生し続けます。エラーが言うのは「エラー」だけです。コードも説明もありません。失敗したときに警告すると、何もありません。

JQueryを使用したJavascript：

$(document).ready(function(){

        $(".post-input").submit(function(){
            var postcontent = $(".post-form").val();

            if (postcontent == ""){
                return false;
            }

            $(".post-form").attr("disabled", "disabled");

            $.ajax({
                url: '/post',
                type: 'POST',
                data: {"post-form": postcontent},
                dataType: json,
                success: function(response, textStatus, jqXHR) {
                    alert("Yay!");
                },
                error: function(jqXHR, textStatus, errorThrown){
                    alert(textStatus, errorThrown);
                }
            });
        });
    });

HTML：

<form class="post-input" action="" method="post" accept-charset="utf-8">
                <textarea class="post-form" name="post-form" rows="1" cols="10" onFocus="this.value='';return false;">What are you thinking about...</textarea>
                <p><input class="post-submit" type="submit" name = "post.submitted" value="Post"></p>
            </form>

そこに問題がなければ、サーバー側（ピラミッド）：

def post(request):
    session = Session()
    user = authenticated_userid(request)
    postContent = request.POST['post-form']
    if not postContent == '':
        session.add(Activity(user.user_id, 0, postContent, None, None))
        return {}
    return HTTPNotFound()

更新：firebugでさらにデバッグした後、postリクエストの本文に{"post-form"：postcontent}の意図した結果ではなく、post.submitted = Postのみが含まれていることがわかりました。

javascriptjquerypythonpyramid
6
Wiz

jQuery のドキュメントによると、データ型を宣言する必要があります。

$.ajax({
  type: 'POST',
  url: url,
  data: data,
  success: success,
  dataType: dataType
});

また、サーバー側のコードを見ると、実際にはJSON形式のデータを投稿したくありません。この {"post-form":postcontent}はJSON形式のデータです。実際にやりたいのは、TEXTまたはHTMLを送信することです。フォームデータのように見えるので、TEXTだと思います。

これを試してください：

$.ajax({
   url: '/post',
   type: 'POST',
   data: 'post-form='+postcontent,
   dataType: 'text',
   success: function(response, textStatus, jqXHR) {
     alert("Yay!");
   },
   error: function(jqXHR, textStatus, errorThrown){
     alert(textStatus, errorThrown);
  }
});
15
TheCarver

JSON-データを投稿しているので、dataType "JSON"を宣言する必要があります。

$.ajax({
  url: '/post',
  type: 'POST',
  dataType: "json",
  data: {"post-form": postcontent},
  success: function(response, textStatus, jqXHR) {
    alert("Yay!");
  },
  error: function(jqXHR, textStatus, errorThrown){
    alert(textStatus, errorThrown);
  }
3
Besnik

問題は、渡したデータが正しく書き込まれていないことだと思います。

これを変更してみてください：

data: {"post-form": postcontent},

これに：

data: 'post-form='+ $('.post-form').val(),
1
Johndave Decano