Как добавить класс CSS в виджет / поле с помощью рендеринга формы на основе шаблона Django 1.11

Примечание: этот вопрос не должен быть объединен с прошлыми вопросами, которые похожи, но до Django 1.11, когда они выпустили рендеринг формы на основе шаблона.

Я понимаю, что Django теперь имеет рендеринг формы на основе шаблонов. Из того, что я понимаю, это должно решить проблему необходимости вводить классы CSS из представления или формы, а не сохранять все HTML/CSS в шаблонах.

это моя цель: держать мои формы и взгляды сфокусированными на что отображается, и мои шаблоны сосредоточены на как, который отображается. Поэтому я хочу сохранить все HTML / CSS в своих шаблонах.

Итак, мои вопросы:

  • как добавить класс (например,form-text) для всех TextInput виджеты из системы шаблонов?
  • как добавить класс (например,alert-warning) для всех сообщений об ошибках (сбоях проверки) из системы шаблонов?

я, возможно, недопонял что-то об этой новой функции, так что если я сделал, не стесняйтесь, дайте мне знать, если это не так, как это работает или если я прошу невозможного. В идеале я хотел бы реализовать эти изменения визуализации формы в главном шаблоне.

Пример

views.py:

class SignUp(generic.edit.CreateView):

    model = models.User
    template_name = 'usermgmt/sign_up.html'
    form_class = forms.UserCreateForm
    success_url = '/sign_up_done/'

templates/master.html (Я хочу поместить здесь что-то, что вызывает все TextInput виджеты для получения класса):

<html>
<head>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">
<title>{% block title %}{% endblock %} | Website</title>
</head>
<body>
  <div class="content-wrapper clearfix">
    {% block main %}{% endblock %}
  </div>
</body>
</html>

templates/usermgmt/sign_up.html:

{% extends 'master.html' %}

{% block title %}Sign Up{% endblock %}

{% block main %}
<h1>Sign Up</h1>
<p>Enter your email to sign up!</p>
<form class="form-group" method="post">
  {% csrf_token %}
  <input type="hidden" name="next" value="{{ next }}">
  {{ form.as_p }}
  <button class="btn btn-primary" type="submit">Sign Up</button>
</form>
{% endblock %}
7
css django django-templates django-widget python

2 ответов

насколько я понял из примечания к выпуску Django 1.11 и из моего собственного тестирования, новые функции только позволяет легко настроить способ отображения виджетов, просто предоставляя HTML-файлы для каждого типа виджетов. В предыдущих версиях Django вы должны были предоставить подкласс forms.widget.Widget и назначьте этот виджет полям модели / формы по одному (IIRC).

если вы хотите сделать все TextInput виджеты имеют определенный класс, вы придется добавить свой пользовательский text.html (и, вероятно, ваш собственный attrs.html так же).

например, допустим, у меня есть С main app. Согласно документам:

если вы используете визуализатор TemplatesSetting, переопределяя шаблоны виджетов работает так же, как переопределение любого другого шаблона в вашем проекте. Вы невозможно переопределить встроенные шаблоны виджетов с помощью других встроенных шаблонов модули подготовки отчетов.

поэтому нам нужно установить наши рендерер в :

FORM_RENDERER = 'django.forms.renderers.TemplatesSetting'

но если мы только это сделаем, нам нужно будет предоставить шаблоны для все элементы ввода. Согласно документам:

использование этого визуализатора вместе со встроенными шаблонами виджетов требует [...] [adding] ' django.формы " в INSTALLED_APPS и по крайней мере один движок с APP_DIRS=True.

поэтому мы добавляем django.forms to INSTALLED_APPS. Теперь, чтобы добавить нашу настройку, скажем, элементы ввода текста, нам нужно создать файл main/templates/django/forms/widgets/text.html и добавьте наш пользовательский HTML-код там, например:

<input type="text" class="myclass" value="{{widget.value}}">

Итак, если мы покажем форму в шаблоне, этот код будет отображаться всякий раз, когда CharField необходимо отобразить, например.

но все это не имеет значения, если вам нужен уровень управления для каждого поля, например, если каждому полю нужен другой класс. В таком случае, вы должны объединить то, что я написал с django-виджет-настройки таким образом, вы можете иметь более гибкую настройку виджета.

3

продолжая от ответа Хосе Томаса Точино выше, в Django 1.11 я обнаружил, что моя структура каталогов должна быть:

main / шаблоны / django / формы / виджеты / текст.HTML-код

6