【问题标题】:Processing Repeated Bootstrap Modals in Django在 Django 中处理重复的引导模式
【发布时间】:2021-12-23 08:10:24
【问题描述】:

人们如何在 Django 中处理需要在多个页面上显示的引导模式?你有一个特殊的类来处理第二种形式吗?您使用 Crispy Forms 吗?

例如,如果我有一个从应用程序所有页面上的导航栏启动的联系我们模式,我将如何适当地处理该模式信息?我无法想象复制和粘贴相同的模态表单并查看代码。这显然不是 DRY。我想会有办法做到这一点,因为这是一个常见的问题。

【问题讨论】:

    标签: django bootstrap-modal django-crispy-forms


    【解决方案1】:

    只需将其全部粘贴到您的 base.html 中?然后在所有其他模板上扩展它。不明白这个问题。

    【讨论】:

      【解决方案2】:

      例如,如果我有一个从应用程序所有页面上的导航栏启动的联系我们模式,我将如何适当地处理该模式信息?我无法想象复制和粘贴相同的模态表单并查看代码。

      考虑使用包含语句,这样您就可以在自己的模板中编写模式,然后将其“包含”到您希望重复使用的页面中。这是一个例子,这里是docs的链接:

      {% include "app/example-modal.html" %}
      

      然后您可以在视图文件中创建一个处理程序来解析来自模态的任何请求。

      【讨论】:

        【解决方案3】:

        我采取的解决方案是:

        1. 按照@ljlozano 的建议在自己的模板中编写我的模态
        2. 将表单放入模态
        3. 通过上下文发送具有唯一名称的表单,并确保使用该表单的所有视图在上下文中都具有该名称。
        4. 为处理视图设置前缀
        5. 通过 AJAX 使用 JavaScript 将表单提交到正确的 URL(该 URL 可以存储在模板中)

        Python 表单和视图

        class ContactUsForm(forms.Form):
            pass
        
        class ContactUsView(FormView, TemplateView):
            prefix = "contact_us_form"
         
        class HomeView(FormView, TemplateView):
            def get_context_data(self, **kwargs):
                context_data = super(HomeView, self).get_context_data(**kwargs)
                context_data.update({"contact_us_form": ContactUsForm(prefix="contact_us_form")})
            
        
                return context_data
        

        模板

        {% load widget_tweaks %}
        
        <script type="module" src={% static "contact_us.js" %}></script>
        
        <div class="modal-body">
            <form method="post" name="id_contact_us_form" id="id_contact_us_form" data-form-url={% url "contact_us" %}>
                <label for="contact_us_form-name">Name</label>
                {% render_field contact_us_form.name class+="form-control" placeholder="Your name" %}
                {{ contact_us_form.errors.name }}
            </form>
        </div>
        

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 2015-09-06
          • 2021-03-03
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2014-03-08
          • 2015-12-17
          • 2021-02-08
          相关资源
          最近更新 更多