Cách tạo cửa sổ phương thức với mẫu Twig và Twitter-Bootstrap

Question

Tôi sử dụng Symfony và boostrap để tùy chỉnh kiểu trang web của tôi. Tôi có một tập tin twig: register_content.html.twig có chứa một mẫu đăng ký.

Trong index.html.twig của tôi, tôi muốn có một cái gì đó như thế:

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

Để hiển thị nội dung của các hình thức đăng ký trong một cửa sổ phương thức, nhưng nó không hoạt động.

tôi cố gắng sử dụng các tài liệu twitter-bootstrap đây: http://bootstrap.braincrafted.com/javascript#modals

Nhưng tôi không thể tìm thấy một cách để áp dụng nó một cách dễ dàng cho cành lá trong symfony ...

Ông có thể giúp tôi?

Cảm ơn

Answer 1

Vấn đề của bạn hoàn toàn không liên quan đến symfony hoặc twig. Bạn đang thiếu thuộc tính dữ liệu cho phương thức hoạt động!

Bạn có thể làm điều đó theo cách sau:

1. Tích hợp các hình thức đăng ký bên index.html của bạn trong một hộp modal và làm theo tấm gương bootstrap cho một hộp modal tĩnh:

   <button type="button" data-toggle="modal" data-target="#myModal">I register !</button> 
   
   <div id="myModal" class="modal hide fade"> 
       <!-- register form here --> 
   </div> 
   

2. Bạn cũng có thể tải nội dung cho mẫu đăng ký thông qua ajax. Trong trường hợp này, thấy tùy chọn từ xa cho modals:

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

   Chỉ cần chắc chắn để không gửi bất kỳ bố trí khi một yêu cầu ajax được thực hiện đối với các url, bởi vì nếu không bạn sẽ có một trang html hoàn chỉnh bên trong div của bạn, đó là không hợp lệ (html-trang bên trong trang html) cũng không phải là một ý tưởng tốt.