Comment créer une fenêtre modale avec le modèle de brindille et Twitter-Bootstrap

J'utilise Symfony et boostrap pour personnaliser le style de mon site web. J'ai un fichier de brindilles : register_content.HTML.brindille qui contient un formulaire d'inscription.

dans mon index.HTML.twig je veux avoir quelque chose comme ça :

<a href="{{ path('fos_user_registration_register') }}" class="btn" data-toggle="modal">Je m'inscris !</a>

pour afficher le contenu du formulaire de Registre dans une fenêtre modale, mais cela ne fonctionne pas.

j'essaie d'utiliser la documentation twitter-bootstrap ici : http://bootstrap.braincrafted.com/javascript#modals

Mais je ne peux pas trouver un moyen de l'appliquer facilement pour brindille dans symfony...

Pourriez-vous m'aider ?

Merci

8
demandé sur Rainbowpeach 2013-04-08 00:43:56

1 réponses

votre problème n'a aucun rapport avec la symfony ou la brindille. Il vous manque attributs data - pour que le modal fonctionne!

Vous pouvez le faire de la façon suivante:

  1. intégrez le formulaire de Registre dans votre index.html dans une boite modale et en suivant l'exemple de bootstrap pour une boite modale statique:

    <button type="button" data-toggle="modal" data-target="#myModal">I register !</button>
    
    <div id="myModal" class="modal hide fade">
        <!-- register form here -->
    </div>
    
  2. Vous pouvez également charger le contenu du formulaire d'inscription via ajax. Dans ce cas, voir l'option remote pour les auxiliaires modaux:

    <a data-toggle="modal" href="{{ path('fos_user_registration_register') }}" data-target="#myModal">click me</a>
    
    <div id="myModal"></div>
    

    assurez-vous simplement de ne pas envoyer de mise en page lorsqu'une requête ajax est exécutée par rapport à l'url, sinon vous aurez une page html complète à l'intérieur de votre div, qui n'est ni valide (page html à l'intérieur de la page html) ni une bonne idée.

10
répondu Sgoettschkes 2015-03-25 14:07:49