简体   繁体   中英

Styling django filter form in html

Here's how my django filter form currently looks:

在此处输入图像描述

And here's my html code:

      <form action="" method="get" class="form-inline">
           {{myfilter.form|bootstrap}}

         <button class="btn btn-primary" type="submit">
           Search</button>
      </form>

I am having trouble with the following:

  1. How do I bring the filters in center of the page?

  2. How do I change the "Name contains" to "Name"?

  3. How do I change the color of text to white in order to make them more visible?

I have tried to search it online but no luckk. Little help will be appreciated. THANKS!

EDIT:

Here's my filters.py:

class WeeklyFilter(django_filters.FilterSet):
    Name = CharFilter(field_name='Name', lookup_expr='icontains')


    class Meta:
        model = Weekly
        fields = '__all__'
        exclude = ['Close','Score']

And my models.py:

Name = models.CharField(max_length=200, null=True)
Close = models.FloatField(null=True)
Score = models.IntegerField(null=True)
Result = models.CharField(max_length=200, choices=choices1,  null=True)

def __str__ (self):
    return self.Name

EDIT 2:

在此处输入图像描述

You can do by adding attribute to your form to make text visible like this

Name = CharFilter(widget=forms.TextInput(attrs={"class":"form-control text-white text-center","max_length":"100"}))

and add this class to your form tag

<form action="" method="get" class="form-inline justify-content-center">

And if somebody are using django-filter library, can do it in html file:

...
{% load widget_tweaks %}
...
    <div class="col-10">
        {{ filter.form.somefield.label_tag }}
        {% render_field filter.form.somefield class="form-select form-select-sm" %}
    </div>

pip install django-widget-tweaks

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM