Bootstrap   发布时间:2022-04-18  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了如何使用Twig模板和Twitter-Bootstrap创建模态窗口大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我使用Symfony和boostrap来定制我的网站的风格.
我有一个twig文件:register_content.html.twig,其中包含一个注册表单.

在我的index.html.twig中我希望有类似的东西:

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

要在模态窗口中显示寄存器表单的内容,但它不起作用.

我尝试使用twitter-bootstrap文档:
http://bootstrap.braincrafted.com/javascript#modals

我无法找到一种方法在symfony中轻松应用它…

你可以帮帮我吗 ?

谢谢

解决方法

你的问题与symfony或twig完全无关.您缺少模态的数据属性

您可以通过以下方式执行此操作:

>将index.html中的寄存器形式集成在一个模态框中,并按照静态模态框的bootstrap示例进行操作:

<button type="button" data-toggle="modal" data-target="#mymodal">I register !</button>

<div id="mymodal" class="modal hide fade">
    <!-- register form here -->
</div>

>您还可以通过ajax加载注册表单的内容.在这种情况下,请参阅模态的远程选项:

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

<div id="mymodal"></div>

只要确保在对url执行ajax请求时不发送任何布局,否则你将在div中有一个完整的html页面,这既不是有效的(html-page in html-pagE)也不是一个好主意.

大佬总结

以上是大佬教程为你收集整理的如何使用Twig模板和Twitter-Bootstrap创建模态窗口全部内容,希望文章能够帮你解决如何使用Twig模板和Twitter-Bootstrap创建模态窗口所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。