Django ModelMultipleChoiceField小部件无法渲染

时间:2017-04-14 20:48:08

标签: javascript python django

我正在尝试使用内置的django管理窗口小部件ModelMultipleChoiceField在表单中呈现这样的内容:

enter image description here

我跟随其他人'建议here,并审核了documentation。但是我得到了一个半完整的小部件;只显示一个框,并且所有相关按钮都不会显示:

enter image description here

此外,当页面加载时,会出现以下错误:

Uncaught ReferenceError: addEvent is not defined at (index):1665

以下是index中导致错误的行:

<script type="text/javascript">
    addEvent(window, "load", function(e) {SelectFilter.init("id_employee_selection", "__unicode__", 0, "/static/admin/"); });
</script>

我在django库中的任何地方找不到addEvent.js,即使它在某些django tickets上被引用。

供参考,以下是我的formHTML

FORM:

from django import forms

class EventAttendeesForm(forms.Form):

    from employees.models import Employee
    from django.contrib.admin.widgets import FilteredSelectMultiple

    employee_selection = forms.ModelMultipleChoiceField(
                    queryset=Employee.objects.all(),
                    widget=FilteredSelectMultiple("__unicode__", is_stacked=False, attrs={'rows':20})
                    )

    def __init__(self, *args, **kwargs):
        super(EventAttendeesForm, self).__init__(*args, **kwargs)
        self.fields['employee_selection'].label = "Employees"

HTML SNIPPET:

<link href="/static/admin/css/widgets.css" type="text/css" media="all" rel="stylesheet" />
<script type="text/javascript" src="/jsi18n/"></script> 
<script type="text/javascript" src="/static/admin/js/jquery.init.js"></script>

<form method='POST' action='' enctype='multipart/form-data'>{% csrf_token %}
{{ form }}
<input type='submit' value='Add Item(s)' />
</form>

{{ media }}

如何正确呈现ModelMultipleChoiceField窗口小部件?

我试过这个hack,但它没有用。

非常感谢提前。

1 个答案:

答案 0 :(得分:0)

想出来:在表单加载之前加载所有form.media和关联的javascripts是至关重要的。

所以,而不是:

<link href="/static/admin/css/widgets.css" type="text/css" media="all" rel="stylesheet" />
<script type="text/javascript" src="/jsi18n/"></script> 
<script type="text/javascript" src="/static/admin/js/jquery.init.js"></script>

<form method='POST' action='' enctype='multipart/form-data'>{% csrf_token %}
{{ form }}
<input type='submit' value='Add Item(s)' />
</form>

{{ media }}

执行此操作(脚本+ form.media放在form之前:

<script type="text/javascript" src="/jsi18n/"></script> 
<script type="text/javascript" src="/static/admin/js/jquery.min.js"></script>
<script type="text/javascript" src="/static/admin/js/jquery.init.js"></script>

{{ media }}

<form method='POST' action='' enctype='multipart/form-data'>{% csrf_token %}
{{ form }}
<input type='submit' value='Add Item(s)' />
</form>