模态的Django 2形式答案

【问题标题】：Django 2 form in modal模态的Django 2形式
【发布时间】：2018-08-06 17:48:25
【问题描述】：

我尝试在 Django 中以 Bootstrap 模式打开用户编辑表单。但是表格是空的，只显示保存按钮。但我不明白如何建立联系。如果我直接调用编辑页面，那么我可以编辑用户 127.0.0.1:8000/account/edit/

index.html，包含对表单的引用

{% extends 'base.html' %}
{% block head %}
{% endblock %}
{% block body %}
<div class="container-fluid">
    <div class="row">
        <div class="col-sm-12 col-md-6">
            <div class="panel panel-default">
                <div class="panel-body">
                    {% if error_message %}
                        <p><strong>{{ error_message }}</strong></p>
                    {% endif %}
                <form action="{% url 'account:edit_profile' %}">
                    <input type="submit" value="Edit" />
                </form>
                <form action="{% url 'account:change_password' %}">
                    <input type="submit" value="Change Login" />
                </form>
                    <br>
<a href="#" role="button" data-toggle="modal" data-target="#edit-profile-modal">Open Modal</a>
                    <br>
                            <div class="control-label col-sm-2">
                                First name:
                            </div>
                            <div class="col-sm-2">
                                {{ user.first_name }}
                            </div><br>
                            <div class="control-label col-sm-2">
                                Last name:
                            </div>
                            <div class="col-sm-2">
                                {{ user.last_name }}
                            </div><br>
                            <div class="control-label col-sm-2">
                                Email:
                            </div>
                            <div class="col-sm-2">
                                {{ user.email }}
                            </div>
            </div>
        </div>
    </div>
</div>
</div>
<div class="modal fade" id="edit-profile-modal" >
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header" align="center">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
                    </button>
                </div>
                <div id="div-forms">
                    {% include "account/edit_profile.html"  with form=form %}
                </div>
            </div>
        </div>
    </div>
{% endblock %}

edit_profile.html

{% block head %}
{% endblock %}
{% block body %}
    <div class="container-fluid">
    <div class="row">
        <div class="col-sm-12 col-md-6">
            <div class="panel panel-default">
                <div class="panel-body">
                    <h3>Profile</h3>
                    {% if error_message %}
                        <p><strong>{{ error_message }}</strong></p>
                    {% endif %}
                         <form method="post">
                            {% csrf_token %}
                            {{ user_form.as_p }}
                            <button type="submit">Save</button>
                        </form>
            </div>
        </div>
    </div>
</div>
</div>
{% endblock %}

views.py

def edit_profile(request):
    if request.method == 'POST':
        user_form = EditUserForm(request.POST, instance=request.user)
        if all([user_form.is_valid(), profile_form.is_valid()]):
            user_form.save()
            return render(request, 'account/index.html')
    else:
        user_form = EditUserForm(instance=request.user)
        args = {'user_form': user_form}
        return render(request, 'account/edit_profile.html', args)

urls.py

urlpatterns = [
    ...
    url(r'^edit/$', views.edit_profile, name='edit_profile'),
    ...
]

forms.py

class EditUserForm(forms.ModelForm):
    class Meta:
        model = User
        fields = (
            'email',
            'first_name',
            'last_name'
        )

我正在使用： Python 3.6.3 Django 2.0.7 视窗 8.1 引导程序 3.3.6 jQuery 1.12.0

【问题讨论】：

标签： python django python-3.x modal-dialog

【解决方案1】：

我认为变量形式不存在，您在模板中使用的只是 user_form 而不是 form 变量

{% include "account/edit_profile.html"  with form=form %}

尝试使用它：

{% include "account/edit_profile.html"  with user_form=user_form %}

【讨论】：

尝试删除edit_profile.html中{% block ... %}的元素，全部。
您是否尝试通过 debuger 或 print() 调试 user_form ？
是的，调试在这里对我没有帮助，因为在 views.py 中没有调用 edit_profile

【解决方案2】：

也许你可以试试我写的代码，你可以在django-bootstrap-modal-forms找到它。您将能够将您的表单绑定到模态框，并且所有验证内容都可以开箱即用。

您将创建一个打开模式的触发元素
您选择的表单将附加到打开的模式中
提交时，表单将通过 AJAX 请求发布到表单的 URL
不成功的 POST 请求会返回错误，会显示在 modal 的表单字段下
成功的 POST 请求将重定向到选定的成功 URL

【讨论】：