Hat jemand bereits ein Anmeldeformular innerhalb eines Bootstrap-Modals mit Symfony 2 und FOS User Bundle erstellt?

Folgendes habe ich jetzt:

src / Webibli / UserBundle / Resources / config / service.yml

authentication_handler:
    class:        Webibli\UserBundle\Handler\AuthenticationHandler
    arguments:    [@router, @security.context, @fos_user.user_manager, @service_container]

app / config / security.yml

form_login:
    provider: fos_userbundle
    success_handler: authentication_handler
    failure_handler: authentication_handler

src / Webibli / UserBundle / Handler / AuthenticationHandler.php

<?php

namespace Webibli\UserBundle\Handler;

use Symfony\Component\Security\Http\Authentication\AuthenticationFailureHandlerInterface;
use Symfony\Component\Security\Http\Authentication\AuthenticationSuccessHandlerInterface;
use Symfony\Component\Security\Core\Authentication\Token\TokenInterface;
use Symfony\Component\Routing\RouterInterface;
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\HttpFoundation\Response;
use Symfony\Component\HttpFoundation\RedirectResponse;
use Symfony\Component\Routing\Router;
use Symfony\Component\Security\Core\SecurityContext;
use Symfony\Component\Security\Core\Exception\AuthenticationException;


class AuthenticationHandler implements AuthenticationSuccessHandlerInterface, AuthenticationFailureHandlerInterface
{

    protected $router;
    protected $security;
    protected $userManager;
    protected $service_container;

    public function __construct(RouterInterface $router, SecurityContext $security, $userManager, $service_container)
    {
        $this->router = $router;
        $this->security = $security;
        $this->userManager = $userManager;
        $this->service_container = $service_container;

    }
    public function onAuthenticationSuccess(Request $request, TokenInterface $token) {
        if ($request->isXmlHttpRequest()) {
            $result = array('success' => true);
            $response = new Response(json_encode($result));
            $response->headers->set('Content-Type', 'application/json');
            return $response;
        }
        else {
            // Create a flash message with the authentication error message
            $request->getSession()->getFlashBag()->set('error', $exception->getMessage());
            $url = $this->router->generate('fos_user_security_login');

            return new RedirectResponse($url);
        }

        return new RedirectResponse($this->router->generate('anag_new')); 
    } 
    public function onAuthenticationFailure(Request $request, AuthenticationException $exception) {

        if ($request->isXmlHttpRequest()) {
            $result = array('success' => false, 'message' => $exception->getMessage());
            $response = new Response(json_encode($result));
            $response->headers->set('Content-Type', 'application/json');
            return $response;
        }
        return new Response();
    }
}

Und hier ist die Twig-Ansicht, die ich in mein Bootstrap-Modal lade:

{% extends 'UserBundle::layout.html.twig' %}
{% trans_default_domain 'FOSUserBundle' %}
{% block user_content %}
<script>
    $('#_submit').click(function(e){
        e.preventDefault();
        $.ajax({
            type        : $('form').attr( 'method' ),
            url         : $('form').attr( 'action' ),
            data        : $('form').serialize(),
            success     : function(data, status, object) {
                console.log( status );
                console.log( object.responseText );
            }
    });
});
</script>
<div class="modal-dialog">
    <div class="modal-content">
        <form action="{{ path("fos_user_security_check") }}" method="post" role="form" data-async data-target="#rating-modal" class="text-left">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title">{{ 'layout.login'|trans }}</h4>
        </div>
        <div class="modal-body">
            {% if error %}
                <div>{{ error|trans }}</div>
            {% endif %}
            <input type="hidden" name="_csrf_token" value="{{ csrf_token }}" />
            <div class="form-group container">
                <label for="email">{{ 'security.login.username_email'|trans }}</label>
                <input type="text" class="form-control" id="username" name="_username" value="{{ last_username }}" required="required" placeholder="[email protected]">
            </div>
            <div class="form-group container">
                <label for="password">{{ 'security.login.password'|trans }}</label><br />
                <input type="password" id="password" name="_password" required="required" class="form-control" placeholder="********">
            </div>
            <div class="form-group container">
                <label for="remember_me">
                    <input type="checkbox" id="remember_me" name="_remember_me" value="on" />
                    {{ 'security.login.remember_me'|trans }}
                </label>
            </div>
        </div>
        <div class="modal-footer">
          <input type="submit" id="_submit" name="_submit" value="{{ 'security.login.submit'|trans }}" class="btn btn-primary">
        </div>
    </form>
</div>
</div>
{% endblock %}

Das Login-Formular funktioniert einwandfrei ohne AJAX. Ich versuche nur, einen Fehler in meinem Formular im Modal zu erhalten, wenn ein Problem auftritt, oder den Benutzer umzuleiten, wenn die Anmeldung erfolgreich war.

Kann jemand erklären, wie man das erreicht?