Пользовательские входы django-filter в templeta
Я хочу улучшить отрисовку входов в шаблоне. Я пробовал добавлять стили из виджетов в классе:
class ProductosFilter(django_filters.FilterSet):
class Meta:
model = Elemento
fields = ('estado','tipo','grupo')
widgets = {
'grupo':widgets.Select(attrs={
'class': 'form-control form-select ',
}),
}
но у меня ничего не получилось
вот мой шаблон:
<div class="col-md-12" style="text-align: right; padding-top: 50px; padding-right: 50px;" >
{{filter.form}}
<button type="submit" class="btn btn-primary">Filtrar</button>
</div>
любой вклад приветствуется
Вы можете использовать JavaScript и получить доступ к этому вводу, используя другие имена или атрибуты, и стилизовать его в JavaScript, как в следующем коде:
var inputVal = document.getElementById("search"); inputVal.style.backgroundColor = "yellow";
Или вы можете либо дать ему идею или атрибут, либо стилизовать свои собственные вводы следующим образом :
input[type=button], input[type=submit], input[type=reset] {
background-color: #4CAF50;
border: none;
color: white;
padding: 16px 32px;
text-decoration: none;
margin: 4px 2px;
cursor: pointer;
}
input[type=text]{
background:yellow;
}
<input type="text">
Я могу взять id селекта, сгенерированный автокамментально путем конкатенации между строкой "id_" + "имя_поля" и установить атрибуты с помощью js или css листа, но я чувствую, что это долгий путь.
<select name="tipo" id="id_tipo">
<option value="" selected="">---------</option>
<option value="Consumo">Consumo</option>
<option value="Inventario">Inventario</option>
<option value="Servicio">Servicio</option>
</select>
js:
select_obj = document.getElementById('id_tipo')
select_obj.style.width = '100px';