Django：当表单处于模态时，不显示表单验证错误

Question

我正在尝试制作一个 Django 网络应用程序，它将能够在数据库中添加和显示某些信息（如下所示的代理模型）我在 Twitter bootstrap 模态中有一个表单。当我输入有效数据并提交时，一切都按预期工作，模式重定向到视图页面。但是，当我输入无效信息时，它不会重新显示显示验证错误的模式，而是重定向到一个空页面。我有打印出验证错误的视图，一切都在那里，只是没有显示在页面上。当我从模板中删除模态 class 时（因此它显示在页面上而不是模态中），将显示错误信息。如何让它显示在模式中？

查看：

class AgentAddView(CreateView):
    model = Agent
    template_name = "agent_form.html"
    success_url = '/ui/all_agents'
    form_class = NewAgentForm

    def form_valid(self, form):
        form.save()
        print('hererererer')
        return redirect('/ui/all_agents')

    def form_invalid(self, form):
        return self.render_to_response(self.get_context_data())

表格：

class NewAgentForm(forms.ModelForm):
    class Meta:
        model = Agent
        fields = ['hostname', 'ip_address', 'domain', 'username', 'password', 'password', 'encrypted']

    hostname = forms.CharField(required=True, widget=forms.TextInput(attrs={'placeholder': 'Hostname'}))
    ip_address = forms.GenericIPAddressField(required=True, widget=forms.TextInput(
    attrs={'placeholder': 'IP Address'}), label="IP Address")
    domain = forms.CharField(required=False, widget=forms.TextInput(attrs={'placeholder': 'Domain'}))
    username = forms.CharField(required=False, widget=forms.TextInput(attrs={'placeholder': 'Username'}))
    password = forms.CharField(widget=forms.PasswordInput(attrs={'placeholder': 'Password'}), required=False)
    confirm_password = forms.CharField(widget=forms.PasswordInput(attrs={'placeholder': 'Confirm Password'}), required=False)
    is_encrypted = forms.BooleanField(required=False)

模板：

{% extends 'base_page.html' %}
{% block content %}
<div class="modal fade" id="add-agent-modal" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">×</button>
                <h3>Add Agent</h3>
            </div>
            <form method="post" action="{% url 'add_agent' %}">
                <div class="modal-body">
                    {% csrf_token %}
                    {{ form.as_p }}
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-success" >Add</button>
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
                </div>
            </form>
        </div>
    </div>
</div>

{% endblock %}

Answer 1

你需要写一些javascript来感知表单是否已提交并发现无效，如果是则显示模态。

您可以根据错误状态在模板中设置一个 javascript 全局变量：

<script>
    document.formHasErrors = {% if form.errors %}true{% else %}false{% endif %};
</script>

那你可以use javascript to tell the modal to open.

<script>
    $( document ).ready(function() {
       if (document.formHasErrors) {
           $('#add-agent-modal').modal('toggle');
       }
    });
</script>

不是特别漂亮，但应该有效。

Django：当表单处于模态时，不显示表单验证错误

Django: form validation errors are not being displayed when form is in a modal

django

twitter-bootstrap

bootstrap-modal