django modelform with bootstrap

Mar*_*ash 1 django django-templates django-forms twitter-bootstrap twitter-bootstrap-3

我想用bootstrap格式化我的模型,没有任何额外的包(只使用bootstrap源文件).我想要配置的特定表单:

class FoodForm(forms.ModelForm):

    class Meta:
        model = Food
        fields = ['name', 'company']
        exclude = ('user', 'edit')
Run Code Online (Sandbox Code Playgroud)

'name'是一个文本字段,我想成为一个bootstrap文本字段,'company'是一个选择字段(来自外键),我想成为一个bootstrap下拉列表.

表单模板的当前设置:

    {% extends "mainsite/base.html" %}

    {% block content %}

    <form method="POST" class="post-form">{% csrf_token %}
        {{ form.as_p }}
        <button type="submit" class="btn btn-primary">Save</button>
</form>
    </form> 

    {% endblock %}
Run Code Online (Sandbox Code Playgroud)

将任何django modelform字段格式化为bootstrap的最佳做法是什么?

Que*_*lan 12

引导字段的技巧是将form-control类注入每个字段,并确保每个字段都存在于form-groupdom元素中.要将该类注入到每个字段中,您可以这样:

class FoodForm(forms.ModelForm):
    def __init__(self, *args, **kwargs):
        super(FoodForm, self).__init__(*args, **kwargs)
        for field in iter(self.fields):
            self.fields[field].widget.attrs.update({
                'class': 'form-control'
        })
Run Code Online (Sandbox Code Playgroud)

现在,在您的django模板中,您可以遍历表单字段,将每个字段放入bootstrap中form-group.例如:

<form method="POST" class="post-form">
    {% for field in form %}
    <div class="form-group">
        {{ field }}
    </div>
    {% endfor %}
</form>
Run Code Online (Sandbox Code Playgroud)

我也会说这个设置(Django + Bootstrap)现在非常普遍,因此谷歌搜索"与django的Bootstrap形式"应该产生更多关于定制这一点的知识.祝好运!