更改 Django 管理中日期字段的默认小部件

Question

如何更改 Django ADMIN 中 DateField 实例的默认小部件？

我知道如何为 ModelForm 执行此操作 - 如何更改 ModelForm 中所有 Django 日期字段的默认小部件？ - 通过提供 formfield_callback 来检查字段类型，然后提供带有新小部件的表单字段。

然而，我的一些 ModelAdmin 可能已经有自定义 ModelForm，有些还没有。我不想在有日期字段的地方提供/更改 ModelForm（这就是重点）。

不过，可用于子类化的自定义 ModelAdmin 就可以了。模型管理员如何更改其表单的日期字段，而不管是否提供了自定义模型表单？

也许 ModelAdmin 具有 get_form() 调用其超级然后设置表单的 formfield_callback ？似乎有点复杂，不确定时间，而且如果任何 ModelAdmin 需要进一步定制，则需要注意三件事......

PS：我在 https://stackoverflow.com/questions/8484811/jquery-datepicker-in-django-admin 是由于是上述 ModelForm 问题的“精确重复”而被错误地关闭。我希望现在差异已经清楚了。

顺便说一句，我个人的动机是 django admin 默认日期选择器的年份导航。生日真的很糟糕......:-) 是的，有一张三年前的票 https://code. djangoproject.com/ticket/9388

Answer 1

我能够在 Django 管理中自定义默认日期小部件。我遵循了两个教程（来自 简单胜于复杂和Django 自定义小部件）

1. 在 Django 应用程序内名为 widgets.py 的文件中编写自定义小部件

from django.forms import DateInput


class CustomDatePickerInput(DateInput):
    template_name = "app_name/widgets/custom_datepicker.html"

    class Media:
        css = {
            "all": (
                "https://cdnjs.cloudflare.com/ajax/libs/datepicker/0.6.5/datepicker.min.css",
            )
        }
        js = (
            "https://code.jquery.com/jquery-3.4.1.min.js",
            "https://cdnjs.cloudflare.com/ajax/libs/datepicker/0.6.5/datepicker.min.js",
            "https://cdnjs.cloudflare.com/ajax/libs/datepicker/0.6.5/i18n/datepicker.es-ES.min.js",
        )

请注意，您可能需要的 CSS 和 JS 文件应该是添加到内部 Media 类中，如上面的代码所示。在本例中，它为自定义日期选择器添加样式。

2. 为您的小部件定义模板，有关更多日期选择器选项，请参见此处，将此文件放入 < code>app_name/templates/app_name/widgets/custom_datepicker.html 或确保此模板与自定义小部件中 template_name 的值相匹配：

{% load i18n %}

{% include "django/forms/widgets/input.html" %}
{% get_current_language as LANGUAGE_CODE %}

<script>
  $(function () {
    const DATE_PICKER_OPTIONS = {
      'en-us': {
        format: 'yyyy-mm-dd',
        language: ''
      },
      'es': {
        format: 'dd/mm/yyyy',
        language: 'es-ES'
      }
    };
    let options = DATE_PICKER_OPTIONS['{{ LANGUAGE_CODE }}'];
    $("input[name='{{ widget.name }}']").datepicker({
      format: options.format,
      language: options.language
    });
  });
</script>

3. 您需要指明是什么小部件在 Django 管理中注册模型时在日期字段中使用（使用 formfield_overrides）。

@admin.register(YourModel)
class YourModelAdmin(admin.ModelAdmin):
    formfield_overrides = {models.DateField: {"widget": CustomDatePickerInput}}

完成此操作后，您将在 Django 管理中拥有一个用于日期的自定义小部件。请记住，这只是一个指南，您可以通过查看我指出的两个教程来进一步了解。

注意：此小部件的实现还支持国际化。

Answer 2

ModelAdmin 只能更改它呈现的表单的小部件，因此很难覆盖传递给它的自定义表单的小部件 - 至少我想不出一种干净的方法来做到这一点。

我可以为您提供一些选项，具体取决于您想要定制的方式/内容。

1. 修改为小部件发挥作用的 JavaScript。如果您的更改可以在那里处理，这似乎很容易。只需提供您自己的 js/calendar.js 和 js/admin/DateTimeShortcuts.js，就像覆盖管理员模板一样。这还有一个额外的好处，那就是升级友好；因为您没有修改 django 代码库；对于使用该小部件的所有表单，更改也会立即生效。

2. 自定义内置 django 小部件来执行您想要的操作。这样做的好处是可以立即工作，无需对现有代码进行任何修改，但除非您小心修补源代码，否则升级不友好。源代码位于 django.contrib.admin.widgets

3. 提供您自己的自定义小部件 - 但随后您又回到了浏览代码并使用您的自定义小部件手动覆盖所有小部件实例的问题.

4. 使用类似 grappelli 的内容并修改 templates/js 来执行您想要的操作。这里的额外好处是，您将免费获得许多其他功能（例如拥有仪表板的能力，如果您将其插入 django-admin-tools)。

django 在他们的管理中广泛使用 jquery，并且他们有自己的 jquery 命名空间（django.jQuery）；因此，如果您打算做一些自定义小部件，请确保使用正确的命名空间以避免奇怪的问题。