Установка css-класса для поля в форме в зависимости от его типа

Я хочу вручную выводить формы входа и регистрации в Django. Вот мой код:

{% load widget_tweaks %}


{% for field in form.visible_fields %}
    <div class="field">
        <label class="label">{{ field.label_tag }}</label>
        <div class="control">
        {% if form.is_bound %}
            {% if field.errors %}
                {% render_field field class="nice-looking-field"%}
                {% for error in field.errors %}
                    {{ error }}
                {% endfor %}
            {% else %}
                {% render_field field %}
            {% endif %}
        {% else %}
            {% render_field field %}
        {% endif %}

        {% if field.help_text %}
            <p>{{ field.help_text }}</p>
        {% endif %}
        </div>
    </div>
{% endfor %}

{% if form.non_field_errors %}
  <div class="box">
    {% for error in form.non_field_errors %}
      {{ error }}
    {% endfor %}
  </div>
{% endif %}

Мой вопрос: можно ли в цикле проверить, какой тип имеет поле, и в зависимости от него назначить определенный css-класс?

Например:

  1. Поле_1 имеет тип text, поэтому применим к нему css-class-1
  2. Поле_2 имеет тип checkbox, поэтому применим к нему css-class-2

вы можете использовать форму django, которая наследуется от modelform, чтобы определить специфический css класс для полей формы.

например, файл models.py:

class Post(models.Model):
    title=models.CharField(max_length=254)
    text=models.TextField() 

файлforms.py

from . import models 
class PostForm(forms.ModelForms):
    class Meta():
        model=models.Post
        fields='__all__'
        widgets={
               'title':forms.TextInput(attrs={'class':'textinputclass'}), #--->> you can use this textinputclass as the css class in your css file to style the title field of your forms.
                'text':forms.Textarea(attrs={'class':'content'})
                }

Теперь в вашем static>css>yourcss.css вы можете получить доступ к классу, который мы определили выше, как обычный класс css.

.content{
  font-size:15px;
}

Вот и все.

Вернуться на верх