使用 django-autocomplete-light 和 bootstrap-datepicker-plus 小部件创建表单时出现问题答案

【问题标题】：Problem when creating a form with both django-autocomplet-light and and bootstrap-datepicker-plus widgets使用 django-autocomplete-light 和 bootstrap-datepicker-plus 小部件创建表单时出现问题
【发布时间】：2020-02-26 21:49:10
【问题描述】：

我正在尝试创建一个使用两个不同小部件的表单：

- some fields are using django-automplete-light ModelSelect2 widget
- another field is using bootstrap_datepicker_plus DatePickerInput widget

但是，我无法让它们都工作：当我仅使用 DatePickerInput 创建表单时，日历显示正确，但是当我使用 ModelSelect2 添加字段时，日历不再弹出。

有谁知道什么可能导致这个问题以及如何解决它？

在 settings.py 中，我为 BOOTSTRAP4 设置了 'include_jquery' = True 以下是表单代码的摘录：

from django.forms import ModelForm
from dal import autocomplete
from bootstrap_datepicker_plus import DatePickerInput

class CreateWhoForm(ModelForm):

    class Meta:

        model = m.Who
        fields = (
            'why',
            'how',
            'begins'
        )
        widgets = {
            # when 'why' and 'how' are commented, DatePickerInput() calendar widget shows correctly
            # when they are present, the calendar widget doesn't show anymore
            'why': autocomplete.ModelSelect2(
                url='core:why-autocomplete'
            ),
            'how': autocomplete.ModelSelect2(
                url='core:how-autocomplete'
            ),
            'begins': DatePickerInput()
        }

还有一些用到的html：

<pre>
{% load static %}
{% load bootstrap4 %}
{% bootstrap_css %}
{% bootstrap_javascript jquery='full' %}

{{ form.media }}

{% for field in form %}
    <div class="form-group{% if field.errors %} has-error{% endif %}">
    <label for="{{ field.id_for_label }}">{{ field.label }}</label>
    {% render_field field class="form-control" placeholder=field.help_text %}
    {% for error in field.errors %}
       <p class="help-block">{{ error }}</p>
    {% endfor %}
    </div>
{% endfor %}

</pre>

【问题讨论】：

标签： jquery django widget bootstrap-datepicker django-autocomplete-light

【解决方案1】：

我遇到了同样的问题，似乎是多次初始化 JQuery 的问题。由于您也在 JQuery 中使用 Bootstrap 和 Autocomplete-light 加载加载 JQuery，因此似乎存在冲突。删除 static/automplete_light/jquery.init.js 似乎可以解决问题。

【讨论】：

删除static/automplete_light/jquery.init.js 到底是什么意思？该文件是 pacakge django-autocomplete-light 的一部分。你的意思是该文件必须从包中删除？或者有没有办法配置包，使其不会尝试在小部件的媒体中包含这个 javascript 文件？
我只是从包本身中删除了该文件。可能有一种方法可以配置包本身，但我不确定。我只需要一个快速而肮脏的解决方案。
如果您在团队中工作，从包中删除文件并不方便。我实际上找到了一个解决方案：升级django-autocomplete-light。事实证明，在比我使用的更新版本中，小部件不再包含 jQuery。