如何使用 django-crispy-forms 制作 Bootstrap 文件浏览按钮

nev*_*int 5 html python django django-crispy-forms twitter-bootstrap-3

这是我的 Django forms.py脚本,使用django-crispy-forms

#!/usr/bin/env python
from django import forms
from .models import Method1
from crispy_forms.helper import FormHelper
from crispy_forms.layout import Submit, Layout

class Method1Form(forms.ModelForm):

    def __init__(self, *args, **kwargs):
        """ Use for wrapping bootstrap
        This is crispy stuff.
        """
        super(Method1Form, self).__init__(*args, **kwargs)
        self.helper = FormHelper()
        self.helper.form_id = 'id-method1Form'
        self.helper.form_class =  'form-horizontal'
        self.helper.label_class = 'col-lg-2'
        self.helper.field_class = 'col-lg-8'
        self.helper.form_method = 'post'
        self.fields['inputfile_param'].label = "Input File"
        self.fields['species_param'].label = "Species"
        self.fields['norm_mode_param'].label = "Normalization"
        self.fields['logscale_param'].label = "Log Scale"
        self.helper.layout = Layout(
                'inputfile_param',
                'species_param',
                'norm_mode_param',
                'logscale_param',
          )
        self.helper.add_input(Submit('submit', 'Submit'))
Run Code Online (Sandbox Code Playgroud)

我可以创建以下表格:

在此输入图像描述

如图所示,我想用 Bootstrap 风格制作浏览按钮。如何才能做到这一点?

我在想这样的事情:

在此输入图像描述

Django 渲染的完整HTML如下所示:

#!/usr/bin/env python
from django import forms
from .models import Method1
from crispy_forms.helper import FormHelper
from crispy_forms.layout import Submit, Layout

class Method1Form(forms.ModelForm):

    def __init__(self, *args, **kwargs):
        """ Use for wrapping bootstrap
        This is crispy stuff.
        """
        super(Method1Form, self).__init__(*args, **kwargs)
        self.helper = FormHelper()
        self.helper.form_id = 'id-method1Form'
        self.helper.form_class =  'form-horizontal'
        self.helper.label_class = 'col-lg-2'
        self.helper.field_class = 'col-lg-8'
        self.helper.form_method = 'post'
        self.fields['inputfile_param'].label = "Input File"
        self.fields['species_param'].label = "Species"
        self.fields['norm_mode_param'].label = "Normalization"
        self.fields['logscale_param'].label = "Log Scale"
        self.helper.layout = Layout(
                'inputfile_param',
                'species_param',
                'norm_mode_param',
                'logscale_param',
          )
        self.helper.add_input(Submit('submit', 'Submit'))
Run Code Online (Sandbox Code Playgroud)
/* Stuff for django-crispy */
.asteriskField {
        display: none;
}


.form-control {
    font-size:18px;
    font-family:  "Helvetica Neue",HelveticaNeue;
}

.form-horizontal {
    padding-left: 120px;
    padding-right: 130px;
    font-size:20px;
    font-family:  "Helvetica Neue",HelveticaNeue;
}
Run Code Online (Sandbox Code Playgroud)

Cor*_*mbs 1

我知道这是一篇旧文章,但对于任何感兴趣的人来说,Crispy Forms 在文档中都有这样的内容:

 FieldWithButtons: You can create an input connected with buttons:

 FieldWithButtons('field_name', StrictButton("Go!"))
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述

这是在脆皮表单Bootstrap 布局对象的文档中