如何使用清晰的表单在一行上显示 Django SelectDateWidget

Posted 2023-02-24

【中文标题】如何使用清晰的表单在一行上显示 Django SelectDateWidget

【英文标题】：How to display Django SelectDateWidget on one line using crispy forms

【发布时间】：2014-07-19 05:37:03

【问题描述】：

我试图在一行上显示使用 Django SelectDateWidget 呈现的 3 个选择字段。当我使用酥脆的表格时，它们都在不同的行上。有没有办法使用布局助手来实现这一点？

谢谢！

class WineAddForm(forms.ModelForm):
hold_until = forms.DateField(widget=SelectDateWidget(years=range(1950, datetime.date.today().year+50)), required=False)
drink_before = forms.DateField(widget=SelectDateWidget(years=range(1950, datetime.date.today().year+50)), required=False)

helper = FormHelper()
helper.form_method = 'POST'
helper.form_class = 'form-horizontal'
helper.label_class = 'col-lg-2'
helper.field_class = 'col-lg-8'
helper.add_input(Submit('submit', 'Submit', css_class='btn-wine'))

helper.layout = Layout(
    'name',
    'year',
    'description',
    'country',
    'region',
    'sub_region',
    'appellation',
    'wine_type',
    'producer',
    'varietal',
    'label_pic',
    'hold_until',
    'drink_before',
)

class Meta:
    model = wine
    exclude = ('user', 'slug', 'likes')

【参考方案1】：

将此添加到您的 SelectDateWidget 字段的布局中：

MultiWidgetField('field_name', attrs=('style': 'width: 33%; display: inline-block;'))

【讨论】：

这就是我需要的，谢谢！看起来我需要阅读有关使用 attrs 修饰符添加样式的内容。

今天真的很方便。谢谢。您是否知道我如何更改三个小部件中每一个的宽度？例如，天的宽度比月份（一月、二月等）短很多。

【参考方案2】：

您可以像这样更改三个小部件的宽度：

.selectdatewidget 
    display: inline-block;


select[name$="_day"].selectdatewidget 
    width: 27%;
    color: red;

select[name$="_month"].selectdatewidget 
    width: 38%;
    color: green;

select[name$="_year"].selectdatewidget 
    width: 35%;
    color: blue;

SelectDateWidget with three differents width