使用 django-bootstrap3 库

1. 配置下载

    pip install django-bootstrap3

    settings配置

    在install_apps中加上 'bootstrap3'

2. 使用（在html文件中使用），表单

    写视图
        写一个表单：

    from django import forms
    from uauth.models import UserInfo

    class UserInfoForm(forms.ModelForm):
        class Meta:
            model = UserInfo
            fields = ("username", "birthday", "signature", "avatar")

        再写一个视图函数

    from django.forms import model_to_dict
    from django.contrib import messages
    from uauth.forms import UserInfoForm
    from uauth.model import UserInfo

    @login_required(login_url="/uauth/;ogin/")
    def mod_userinfo(request):
        user_info = request.user.userinfo
        user_info_dict = model_to_dict(user_info)

        if request.method == "GET":
            form = UserInfoForm(data=user_info_dict)
            return render(request, "uauth/mod_userinfo.html", {"form": form})
        if request.method == "POST":
            # 保存图片
            pic = request.FILES["avatar"]
            user_info.avatar = pic
            user_info.save()
            # 保存数据
            form = UserInfoForm(data=request.POST, instance=user_info)
            if form.is_valid():
                form.save()
                return redirect(to="/uauth/my-info-page")
            else:
                messages.add_message(request, messages.ERROR, form.errors.as_text())
                return render(request, "uauth/mod_userinfo", {"form": form})
 

    写模版

        导入(文件开头位置)：

        {% load bootstrap3 %}

        使用bootstrap_messages，在文件中的适当位置写上就会显示messages的内容

        {% bootstrap_messages %}

        使用默认表单 bootstrap_form

            最简单的方式：label和field显示的是上下格式

            {% bootstrap_form form %}

            显示成水平方式：

            {% bootstrap_form form layout="horizontal" %}

                调节label的class：
                horizontal_label_class=”xxx” # 只对horizontal模式有效
                或 label_class=”xxx” # 都有效
                调节field的class：
                horizontal_field_class=”yyy” # 只对horizontal模式有效
                field_class=”yyy” # 都有效
                调节每个input+label外面的div的class，默认是form-group
                form_group_class=”xxx”
                上面是几种常用的属性，还有很多可以看官方文档django-bootstrap3

            省去label：

            {% bootstrap_form form layout="inline" %}

    优点
        使用django_bootstrap3的form的优点之一就是，他可以自动的生成错误提示，非常方便

    我遇到的问题

        水平排列问题
        # 我要做一个修改用户信息的页面的时候用到了bootstrap_form,但是我想要他水平horizontal排列
        # 使用layout=horizontal之后发现各个input之间紧挨着，没有一定的空隙
        # 通过查官方文档知道要把form的class改成form-horizontal，但是bootstrap_form中没有参数去修改form的class的
        # 经过一番比较与排查，发现
        # 让form_group_class="form-group form-horizontal" horizontal_label_class="col-sm-3" horizontal_field_class="col-sm-7 form-group" 也能达到类似的效果
        # 经过修改后的bootstrap_form是：
        {% bootstrap_form form layout="horizontal" form_group_class="form-group form-horizontal" horizontal_label_class="col-sm-3 text-right" horizontal_field_class="form-group col-sm-7" %}

        保存信息问题

        最早我的form=UserInfoForm(request.POST)直接is_valid()通过后save()是有问题的，因为这里面的字段并不是全部的UserInfo字段，就会把其他字段的内容变成null，就报错，这是我们需要把对象传进来
        form = UserInfoForm(data=request.POST, instance=user_info)
        这是再save()的时候就是更新，而不是把哪些字段为空了。

        上传图片问题

        我上面的avatar是一个图片字段，是用户头像，上传的时候，form取的是request.POST里的数据，是无法取到file文件的，所以我又写了几步来保存图片，当然也可以在里面对图片处理(PIL)和筛选.

        pic = request.FILES["avatar"]
        user_info.avatar = pic
        user_info.save()

https://blog.csdn.net/smartwu_sir/article/details/80211737