Django ModelMultipleChoiceField小部件未渲染 [英] Django ModelMultipleChoiceField Widget not Rendering

问题描述

我正在尝试使用内置的django管理员小部件 ModelMultipleChoiceField 以如下形式呈现此类内容:

我已在

此外，在页面加载时，会出现以下错误:

 未捕获的ReferenceError:未在(index):1665定义addEvent 

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

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

即使在某些Django addEvent.js .="nofollow noreferrer">门票.

作为参考，下面是我的 form 和 HTML

FORM:

Django导入表单中的

 类EventAttendeesForm(forms.Form):从employee.models导入Employee从django.contrib.admin.widgets导入FilteredSelectMultiple员工选择=表格.模型多重选择场(queryset = Employee.objects.all()，widget = FilteredSelectMultiple("__ unicode__"，is_stacked = False，attrs = {'rows':20}))def __init __(self，* args，** kwargs):超级(EventAttendeesForm，self).__ init __(* args，** kwargs)self.fields ['employee_selection'].label =雇员" 

HTML片段:

 < 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％}{{ 形式 }}< input type ='submit'value ='Add Item(s)'/></form>{{ 媒体 }} 

如何正确呈现 ModelMultipleChoiceField 小部件?

我已经尝试过 hack ，但是它不起作用./p>

非常感谢.

解决方案

弄清楚了:在加载表单之前先加载所有 form.media 和相关的javascript，这一点至关重要.

所以，而不是:

 < 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％}{{ 形式 }}< input type ='submit'value ='Add Item(s)'/></form>{{ 媒体 }} 

执行此操作(将脚本+ 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>{{ 媒体 }}< form method ='POST'action =''enctype ='multipart/form-data'> {％csrf_token％}{{ 形式 }}< input type ='submit'value ='Add Item(s)'/></form> 

I am trying to use the built-in django admin widget ModelMultipleChoiceField to render something like this in a form:

I have followed others' recommendations here, and have reviewed the documentation. but I am getting a half-complete widget; only one box is showing, and all of the associated buttons don't appear:

In addition, when the page loads, the following error is given:

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

Here is the line within index that is causing the error:

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

I cannot find addEvent.js anywhere within the django library, even though it is referenced on some django tickets.

For reference, below are my form and HTML

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 }}

How can I correctly render the ModelMultipleChoiceField widget?

I have tried this hack but it doesn't work.

Many thanks in advance.

解决方案

Figured it out: it is critical to have all form.media and associated javascripts load before the form loads.

So, instead of:

<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 }}

Do this (scripts + form.media placed before 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>

这篇关于Django ModelMultipleChoiceField小部件未渲染的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！