如何使用 Django Widget Tweaks

Django 提供了创建表单的简单方法。 有多种创建表单的方法，但强烈建议使用 Django 内置表单。 因为它将自动化大量工作并提供稳定且安全的功能。 但是 Django 内置表单的问题是它不允许我们轻松编辑表单以自定义设计。

在本教程中，我们将看到一种自定义 Django 表单的常用方法。 我们将在表单的各个字段中包含我们的自定义 CSS、类或 id。 让我们看看为什么我们需要使用 Django widget tweaks。

Django 内置表单的问题

在转向 Django widget tweaks 包之前，我们将详细说明我们在 Django 内置表单中遇到的一些问题。

我们使用 Bootstrap 类创建一个表单。 让我们看看简单表单的代码。

在这里，我们设计了一个简单的表单，其中包含一些属性，我们可以根据我们的要求添加更多属性。 现在我们将在 model.py 文件中创建一个模型。

使用此模型，我们创建一个 Django 表单。 创建一个forms.py文件并添加以下代码。

form.html

运行服务器并访问 http://127.0.0.1:8000/form/。

Django Tweaks 的安装

要自定义 Django 内置表单，我们需要使用 Django tweaks。 我们使用以下命令安装。

安装到系统中后，将widget_tweaks添加到您的 INSTALLED_APPS 中。

用途

在本节中，我们将展示该软件包提供的众多选项中的几个。 如果您想了解所有内容，可以参考其官方文档。 widget-tweaks 应用程序提供了两组可以一起使用或单独使用的选项。

• 一个render_field模板标签，用于通过类似 HTML 的语法自定义表单字段。
• 几个模板过滤器，用于自定义表单字段 HTML 属性和 CSS 类。

render_fields 更易于使用，并且使设计师和前端开发人员的字段自定义变得更容易。

但是，模板过滤器比 render_field 标签更强大。 但是它们相当复杂，而且 HTML 语法较少。

要开始使用它，我们必须在模板文件中加载以下标签。

现在通过遍历其字段来扩展您的表单，以公开输入标签，替换此内容。

从此

输出

如上图所示，表单设计得到了改进，但我们的表单看起来不太好。

现在我们使用 django tweaks 并将额外的属性添加到 field 元素。

我们已将 bootstrap 类应用于每个 Django 表单字段。 我们将在 CSS 文件中包含所有代码，以便通过类或 id 自定义每个字段。

让我们了解 render_field 的以下实现。

Django-tweaks 包是一个用于自定义表单字段的强大工具。 它有助于我们将 bootstrap 类应用于每个字段。 因此，我们必须设计 HTML，使用 CSS，并通过将输入标签替换为render_field并将form.field_name替换为 {%%} 并在末尾使用我们的选择来设计它。