7

私のajax呼び出しは次のようになります

$.ajax({ //actually approve or reject the promotion
                url: url,
                type: "POST",
                data: '{'+data.PromotionId+','+data.UserId+','+data.ReasonText+'}',
                dataType: "json",
                //contentType: "application/json; charset=utf-8",
                success: function (data) {
                    if (indicator == 'A') {
                        alert('Promotion approved successfully!');
                    }
                    else {
                        alert('Promotion rejected successfully.');
                    }

                    var homelink = '<%: Url.Action("Index","Home") %>';
                    window.location.href = (homelink);


                    returndata = data;
                },
                error: function (xhRequest, ErrorText, thrownError) {
                    alert("Failed to process promotion correctly, please try again");
                    console.log('xhRequest: ' + xhRequest + "\n");
                    console.log('ErrorText: ' + ErrorText + "\n");
                    console.log('thrownError: ' + thrownError + "\n");
                }
            });

そして、私のMVCコントローラーは次のようになります。

 [HttpPost]
    public HttpResponseMessage ApprovePromotion(PromotionDecision decision)
    {
        if (ModelState.IsValid && decision != null)
        {
            bool status = PromotionBo.ApprovePromotion(decision);
            if (status == true)
                return new HttpResponseMessage(HttpStatusCode.OK);
        }
        return new HttpResponseMessage(HttpStatusCode.BadRequest);
    }

私はこれらの両方で構文が正しいと思っていましたが、ajax呼び出しを行うたびに400応答が返されます。私が間違っているのは何ですか?

4

2 に答える 2

13

完全に壊れた無効な JSON 文字列をサーバーに送信しています。コントローラーのアクションがそれを拒否するのは正常です。contentTypeそれに加えて、JSON リクエストを送信することを指定するパラメーターをコメントに入れました。

したがって、リクエストを行う正しい方法は次のとおりです。

$.ajax({ //actually approve or reject the promotion
    url: url,
    type: "POST",
    data: JSON.stringify({ 
        // Those property names must match the property names of your PromotionDecision  view model
        promotionId: data.PromotionId, 
        userId: data.UserId, 
        reasonText: data.ReasonText
    }),
    contentType: "application/json; charset=utf-8",
    success: function (data) {
        if (indicator == 'A') {
            alert('Promotion approved successfully!');
        }
        else {
            alert('Promotion rejected successfully.');
        }

        var homelink = '<%: Url.Action("Index","Home") %>';
        window.location.href = (homelink);

        returndata = data;
    },
    error: function (xhRequest, ErrorText, thrownError) {
        alert("Failed to process promotion correctly, please try again");
        console.log('xhRequest: ' + xhRequest + "\n");
        console.log('ErrorText: ' + ErrorText + "\n");
        console.log('thrownError: ' + thrownError + "\n");
    }
});

JSON.stringifyサーバーに送信される JSON が正しく、すべての値が適切にエンコードされていることを確認するために、最近のブラウザーにネイティブに組み込まれているメソッドをどのように使用しているかに注目してください。また、石器時代のブラウザをサポートする必要がある場合は、メソッドjson2.jsを定義するスクリプトをページに含めることができますJSON.stringify

重要な注意事項:コードのように文字列連結を使用して JSON 文字列を作成しないでください。

あるいは、JSON リクエストを送信したくない場合は、標準のapplication/x-www-form-urlencodedリクエストを送信できます。

$.ajax({ //actually approve or reject the promotion
    url: url,
    type: "POST",
    data: { 
        promotionId: data.PromotionId, 
        userId: data.UserId, 
        reasonText: data.ReasonText
    },
    success: function (data) {
        if (indicator == 'A') {
            alert('Promotion approved successfully!');
        }
        else {
            alert('Promotion rejected successfully.');
        }

        var homelink = '<%: Url.Action("Index","Home") %>';
        window.location.href = (homelink);

        returndata = data;
    },
    error: function (xhRequest, ErrorText, thrownError) {
        alert("Failed to process promotion correctly, please try again");
        console.log('xhRequest: ' + xhRequest + "\n");
        console.log('ErrorText: ' + ErrorText + "\n");
        console.log('thrownError: ' + thrownError + "\n");
    }
});

これは同じように機能し、コントローラー アクションはモデルを適切にバインドできるはずです。

注意: 成功のコールバックで次の行が使用されていることに気付きました: returndata = data;. これにより、成功コールバックの外で非同期 AJAX リクエストの結果を消費しようとしていると思われますが、これは不可能です。この変数で何をしているのかわかりませんが、returndata間違っていると感じています。

于 2013-01-11T15:50:47.813 に答える