Django Forms Шаблоны дизайна шаблонов

Question

Структура Django Forms превосходна и отображает всю форму только следующим образом.

{{ form.as_p }} 

Для регистрационной формы, она преобразует выше в:

<p><label for="id_username">Username:</label> <input id="id_username" type="text" name="username" maxlength="30" /> Required. 30 characters or fewer. Alphanumeric characters only (letters, digits and underscores).</p> 
<p><label for="id_email">Email:</label> <input type="text" name="email" id="id_email" /></p> 
<p><label for="id_firstname">Firstname:</label> <input type="text" name="firstname" id="id_firstname" /></p> 
<p><label for="id_lastname">Lastname:</label> <input type="text" name="lastname" id="id_lastname" /></p> 
<p><label for="id_password1">Password:</label> <input type="password" name="password1" id="id_password1" /></p> 
<p><label for="id_password2">Password confirmation:</label> <input type="password" name="password2" id="id_password2" /></p> 

Но ради дизайна я хочу добавить классы к каждому элементу в форме, следующим образом:

<p><label for="id_email" class="field-title">Email:</label> <input type="text" name="email" id="id_email" /></p> 
<p><label for="id_firstname" class="field-title">Firstname:</label> <input type="text" name="firstname" id="id_firstname" /></p> 
<p><label for="id_lastname" class="field-title">Lastname:</label> <input type="text" name="lastname" id="id_lastname" /></p> 
<p><label for="id_password1" class="field-title">Password:</label> <input type="password" name="password1" id="id_password1" /></p> 
<p><label for="id_password2" class="field-title">Password confirmation:</label> <input type="password" name="password2" id="id_password2" /></p> 

Каков стандартный способ добавления этих классов в отдельные элементы формы. Нужно ли развернуть форму в шаблоне вручную, чтобы добавить эти классы (в этом случае изменение формы должно также внести соответствующие изменения в шаблон); Это слишком трудоемко, особенно если вам нужно добавить ошибки, отобразить ошибки и для каждого из этих полей.

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

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

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

Answer 1

Если вам просто нужны все ярлыки для определенного класса, лучшим способом было бы немного изменить разметку и CSS. Поставьте <div> с классом вокруг формы:

<div class="field-title"> 
    {{ form.as_p }} 
</div> 

и сделать определение CSS следующим образом:

div.field-title label { 
    ... 
} 

Answer 2

Аналогичный вопрос: Add class to Django label_tag() output. Я не уверен, что выбранный ответ на этот вопрос будет соответствовать вашим потребностям или нет.

Answer 3

Я тоже искал то же самое, просто добавив информацию, если вы не в курсе это.

Если вы хотите применить CSS к конкретной области, вы можете извлечь отдельные поля формы, как, как следует

Например: поле формы name:

{{ form.name.label }} 
{{ form.name.errors }} 
{{ form.name }} 
{{ form.name.help_text }} 

Теперь вместо {{ form.name.label }}, вы можете предоставить ваше собственное форматирование, как вы упомянули.

Другой способ добавления имени класса через javascript.

Answer 4

Добавление класса непосредственно в поле формы в качестве атрибута показалось мне самым удачным способом.

name = forms.CharField(widget=forms.TextInput(attrs={"class":"form-control"})) 

message = forms.CharField(widget=forms.Textarea(attrs={"class":"form-control bar foo"})) 

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