Взято из моего ответа на:
Как разметить поля формы с помощью <div class = 'field_type'> в Django
class MyForm(forms.Form):
myfield = forms.CharField(widget=forms.TextInput(attrs={'class' : 'myfieldclass'}))
или
class MyForm(forms.ModelForm):
class Meta:
model = MyModel
def __init__(self, *args, **kwargs):
super(MyForm, self).__init__(*args, **kwargs)
self.fields['myfield'].widget.attrs.update({'class' : 'myfieldclass'})
или
class MyForm(forms.ModelForm):
class Meta:
model = MyModel
widgets = {
'myfield': forms.TextInput(attrs={'class': 'myfieldclass'}),
}
--- РЕДАКТИРОВАТЬ ---
Вышесказанное - самое простое изменение кода исходного вопроса, которое выполняет заданное. Это также удерживает вас от повторения, если вы повторно используете форму в других местах; ваши классы или другие атрибуты просто работают, если вы используете методы формы Django as_table / as_ul / as_p. Если вам нужен полный контроль для полностью настраиваемого рендеринга, это четко задокументировано
- РЕДАКТИРОВАТЬ 2 ---
Добавлен новый способ указать виджет и атрибуты для ModelForm.
id
. Во-вторых, это обычно ответная сторона шаблона, чтобы выполнить это, особенно, если вы собираетесь получить доступ к этому классу через методы внешнего интерфейса (js, css). Я не сказал, что ваш ответ неверен. На мой взгляд, это просто плохая практика (особенно, когда вы работаете в команде с внешними и внутренними разработчиками).Это можно сделать с помощью пользовательского шаблона фильтра. Подумайте, как визуализировать вашу форму следующим образом:
form.subject
это экземплярBoundField
которого имеетas_widget()
метод.Вы можете создать собственный фильтр
addclass
в my_app / templatetags / myfilters.py :А затем примените свой фильтр:
form.subjects
будет отображаться сMyClass
помощью класса CSS.источник
{{ form.subject|addclass:'myclass1 myclass2' }}
Если вы не хотите добавлять какой-либо код в форму (как упоминалось в комментариях к ответу @ shadfc), это, безусловно, возможно, здесь есть два варианта.
Во-первых, вы просто ссылаетесь на поля индивидуально в HTML, а не на всю форму сразу:
(Обратите внимание, что я также изменил его в несортированный список .)
Во-вторых, обратите внимание на документацию по выводу форм как HTML , Django:
Все поля формы уже имеют уникальный идентификатор . Таким образом, вы должны ссылаться на id_subject в вашем CSS-файле для стилизации предметного поля. Должен заметить, что вот как ведет себя форма, когда вы берете HTML по умолчанию , для чего требуется просто напечатать форму, а не отдельные поля:
Смотрите предыдущую ссылку для других опций при выводе форм (вы можете сделать таблицы и т. Д.).
Примечание. Я понимаю, что это не то же самое, что добавить класс к каждому элементу (если вы добавили поле в форму, вам также необходимо обновить CSS), - но достаточно просто ссылаться на все поля по идентификатору. в вашем CSS вот так:
источник
В этом сообщении вы можете добавлять классы CSS в свои поля, используя специальный шаблонный фильтр.
источник
Вы можете сделать так:
Надеюсь, что это работает.
Игнас
источник
Вы можете использовать эту библиотеку: https://pypi.python.org/pypi/django-widget-tweaks
Это позволяет вам делать следующее:
источник
render_field
.Ты можешь сделать:
Затем вы можете добавить классы / идентификаторы, например, к
<td>
тегу. Конечно, вы можете использовать любые другие теги, которые вы хотите. Установите флажок Работа с формами Django в качестве примера того, что доступно для каждойfield
формы ({{field}}
например, просто выводится тег ввода, а не метка и т. Д.).источник
Одним из решений является использование JavaScript для добавления необходимых классов CSS после того, как страница готова. Например, стилизация вывода формы django с помощью классов начальной загрузки (для краткости используется jQuery):
Это позволяет избежать уродства смешивания особенностей стиля с вашей бизнес-логикой.
источник
Напишите свою форму как:
В вашем HTML-поле сделайте что-то вроде:
Затем в вашем CSS напишите что-то вроде:
Надеюсь, что этот ответ стоит попробовать! Обратите внимание, что вы должны написать свои представления для отображения HTML-файла, который содержит форму.
источник
Вам может не понадобиться переопределять ваш класс формы '
__init__
, потому что Django устанавливаетname
&id
атрибуты в HTML-input
файлах. Вы можете использовать CSS следующим образом:источник
id
поле, созданное Django для наборов форм, становится довольно волосатым…Не видел этого на самом деле ...
https://docs.djangoproject.com/en/1.8/ref/forms/api/#more-granular-output
Более гранулированный выход
Методы as_p (), as_ul () и as_table () - просто ярлыки для ленивых разработчиков - они не единственный способ отображения объекта формы.
class BoundField Используется для отображения HTML или доступа к атрибутам для одного поля экземпляра формы.
Метод str () ( Unicode на Python 2) этого объекта отображает HTML-код для этого поля.
Чтобы получить один BoundField, используйте синтаксис поиска по словарю в форме, используя имя поля в качестве ключа:
Чтобы получить все объекты BoundField, выполните итерацию формы:
Специфичные для поля выходные данные учитывают параметр auto_id объекта формы:
источник
Существует очень простой в установке и прекрасный инструмент, созданный для Django, который я использую для стилей, и его можно использовать для любого фреймворка, такого как Bootstrap, Materialize, Foundation и т. Д. Он называется widget-tweaks Документация: Widget Tweaks
из форм импорта Django
Вместо использования по умолчанию:
Вы можете редактировать его по-своему, используя атрибут render_field, который дает вам более html-подобный способ его стилизации, как в следующем примере:
template.html
Эта библиотека дает вам возможность хорошо отделить ваш внешний интерфейс от вашего внутреннего интерфейса.
источник
В Django 1.10 (возможно, и раньше) вы можете сделать это следующим образом.
Модель:
Форма:
Шаблон:
источник
Изменить: Другой (немного лучший) способ сделать то, что я предлагаю, ответ здесь: Django формы поля ввода
Все вышеперечисленные варианты потрясающие, просто подумал, что я добавлю этот, потому что он отличается.
Если вы хотите, чтобы в ваших формах использовались пользовательские стили, классы и т. Д., Вы можете сделать HTML-ввод в свой шаблон, соответствующий полю формы. Например, для CharField (виджет по умолчанию
TextInput
), скажем, вам нужен ввод текста в стиле начальной загрузки. Вы бы сделали что-то вроде этого:<input type="text" class="form-control" name="form_field_name_here">
И пока вы вводите имя поля формы, совпадающее с
name
атрибутом html , (и виджет, вероятно, также должен соответствовать типу ввода), Django будет запускать все те же валидаторы в этом поле при запускеvalidate
илиform.is_valid()
и иСтилизация других вещей, таких как метки, сообщения об ошибках и текст справки, не требует большого количества обходных путей, потому что вы можете сделать что-то подобное
form.field.error.as_text
и стилизовать их так, как вы хотите. Фактические поля - те, которые требуют некоторого возни.Я не знаю, является ли это лучшим способом или способом, который я бы порекомендовал, но это способ, и он может быть правильным для кого-то.
Вот полезное пошаговое руководство по стилю форм, и оно включает большинство ответов, перечисленных в SO (например, использование attr для виджетов и настройки виджетов). https://simpleisbetterthancomplex.com/article/2017/08/19/how-to-render-django-form-manually.html
источник
Стилизация экземпляров виджета
Если вы хотите, чтобы один экземпляр виджета отличался от другого, вам нужно будет указать дополнительные атрибуты во время создания экземпляра объекта виджета и присвоения его полю формы (и, возможно, добавить некоторые правила в ваши CSS-файлы).
https://docs.djangoproject.com/en/2.2/ref/forms/widgets/
Для этого вы используете аргумент Widget.attrs при создании виджета:
Вы также можете изменить виджет в определении формы:
Или, если поле не объявлено непосредственно в форме (например, поля формы модели), вы можете использовать атрибут Form.fields:
Затем Django включит дополнительные атрибуты в визуализированный вывод:
источник