2

私はSymfony2で簡単なブログアプリケーションに取り組んでいます。
ajax経由でログインデータを確認したい：

  • データが正しい場合->別のページに転送
  • そうでない場合->400ステータスで応答し、フォームをアニメーション化します

私の問題は、JQueryが送信するリクエストがXHRではないように見えることです。

HTML：

<form id="logfo" action="{{path('Login_Ajax')}}" method="POST">
    <p> Name </p>
    <input type="text" id="logname"> </br>
    <p> Password </p>
    <input type="text" id="logpass"> </br>
    <input type="submit" value="Log In">
</form>

Javascript：

$(document).ready(function() {
    //listen for the form beeing submitted
    $("#logfo").submit(function(){
        var url = $("#logfo").attr("action");
        //start the post
        $.post(url,{Name:$("#logname").val(),
            Password:$("#logpass").val()}, 
            function(data){
                if(data.responseCode==400) {
                    //animate the Form
                    var fo=$("#logfo");
                    fo.animate({left:'+=25px'}, "fast");
                    fo.animate({left:'-=50px'}, "fast");
                    fo.animate({left:'+=50px'}, "fast");
                    fo.animate({left:'-=25px'}, "fast");
                }
        });
    }); 
});

routing.yml：

Login_Ajax:
pattern: /thefitthing/logjax
defaults: {_controller: FitcompTheFitThingBlogBundle:Ajax:login }
requirements:
    _method:  POST


テスト上の理由から、リクエストを単純なif-termsを使用してデータベースからのデータと比較するためのコードを置き換えました。
コントローラ：

class AjaxController extends Controller {

    public function logInAction()
    {
        $request = $this->getRequest();
        if ($request->isXmlHttpRequest()) { 
            $name=$request->request->get('Name');
            if($name == "page") return new Response("",400);
            if($name == "plant") return $this->redirect($this->generateUrl('Thanks_Page'));
        }
        else return $this->render('FitcompTheFitThingBlogBundle:Blog:test.html.twig', array('hint' => "noXHR"));
    }
}
4

1 に答える 1

4

submitハンドラーはブラウザーによるフォームの送信を妨げないため、XHRリクエストが完了する機会はありません（ブラウザーは最初に通常のPOSTを実行するだけです）。これは、呼び出しを削除するだけで確認できます$.post。動作にまったく違いはありません。

デフォルトのアクションを防ぐことにより、これを修正します。

$("#logfo").submit(function(event) {
    event.preventDefault();
    $.post(...);
});
于 2013-02-28T21:45:21.877 に答える