django-import-export 表单 <input> 未在带有 grappelli 的自定义管理模板中呈现
django-import-export form <input> not rendering in custom admin template w/ grappelli
在使用 django-grappelli 为管理员 UI 的项目上实施 django-import-export 后,我发现两个库之间存在一些 CSS 不兼容性:https://github.com/sehmaschine/django-grappelli/issues/435
为了解决这个问题,我创建了自定义管理模板覆盖,因此导入导出使用 grappelli 的 CSS:
/templates/admin/import_export/base.html
{% extends "admin/base_site.html" %}
{% load i18n admin_static admin_modify %}
{% load admin_urls %}
{% block bodyclass %}{{ opts.app_label }}-{{ opts.object_name.lower }} change-form{% endblock %}
{% if not is_popup %}
{% block breadcrumbs %}
<ul>
<li><a href="{% url 'admin:index' %}">{% trans 'Home' %}</a></li>
<li><a href="{% url 'admin:app_list' app_label=opts.app_label %}">{{ opts.app_label|capfirst|escape }}</a></li>
<li><a href="{% url opts|admin_urlname:'changelist' %}">{{ opts.verbose_name_plural|capfirst }}</a></li>
<li> {% block breadcrumbs_last %}{% endblock %}</li>
</ul>
{% endblock %}
{% endif %}
/templates/admin/import_export/change_list.html
{% extends "admin/change_list.html" %}
{% load i18n grp_tags %}
{# Original template renders object-tools only when has_add_permission is True. #}
{# This hack allows sub templates to add to object-tools #}
{% block object-tools %}
<ul class="grp-object-tools">
{% block object-tools-items %}
{% if has_add_permission %}
{{ block.super }}
{% endif %}
{% endblock %}
</ul>
{% endblock %}
/templates/admin/import_export/import.html
{% extends "admin/import_export/base.html" %}
{% load i18n grp_tags %}
{% load admin_urls %}
{% load import_export_tags %}
{% block breadcrumbs_last %}
{% trans "Import" %}
{% endblock %}
{% block content %}
{% if confirm_form %}
<form action="{% url opts|admin_urlname:'process_import' %}" method="POST">
{% csrf_token %}
{{ confirm_form.as_p }}
<p>
{% trans "Below is a preview of data to be imported. If you are satisfied with the results, click 'Confirm import'" %}
</p>
<div class="grp-form-row grp-submit-row">
<input type="submit" class="grp-button grp-default" name="confirm" value="{% trans 'Confirm import' %}">
</div>
</form>
{% else %}
<form action="" method="POST" enctype="multipart/form-data">
{% csrf_token %}
<div>
<div class="grp-form-row"><p>
{% trans "This importer will import the following fields: " %}
<code>{{ fields|join:", " }}</code>
</p></div>
<fieldset class="module aligned">
{% for field in form %}
<div class="grp-form-row">
{{ field.errors }}
<div class="c-1">{{ field.label_tag }}</div>
<div class="c-2">{{ field }}
{% if field.field.help_text %}
<p class="help grp-help">{{ field.field.help_text|safe }}</p>
</div>
{% endif %}
</div>
{% endfor %}
</fieldset>
<div class="grp-form-row grp-submit-row">
<input type="submit" class="grp-button grp-default" value="{% trans 'Submit' %}">
</div>
</div>
</form>
{% endif %}
{% if result %}
{% if result.has_errors %}
<h2>{% trans "Errors" %}</h2>
<ul>
{% for error in result.base_errors %}
<li>
{{ error.error }}
<div class="traceback errornote">{{ error.traceback|linebreaks }}</div>
</li>
{% endfor %}
{% for line, errors in result.row_errors %}
{% for error in errors %}
<li>
{% trans "Line number" %}: {{ line }} - {{ error.error }}
<div><code>{{ error.row.values|join:", " }}</code></div>
<div class="traceback errornote">{{ error.traceback|linebreaks }}</div>
</li>
{% endfor %}
{% endfor %}
</ul>
{% else %}
<h2>
{% trans "Preview" %}
</h2>
<table>
<thead>
<tr>
<th></th>
{% for field in result.diff_headers %}
<th>{{ field }}</th>
{% endfor %}
</tr>
</thead>
{% for row in result.rows %}
<tr>
<td>
{% if row.import_type == 'new' %}
{% trans "New" %}
{% elif row.import_type == 'skip' %}
{% trans "Skipped" %}
{% elif row.import_type == 'delete' %}
{% trans "Delete" %}
{% elif row.import_type == 'update' %}
{% trans "Update" %}
{% endif %}
</td>
{% for field in row.diff %}
<td>
{{ field }}
</td>
{% endfor %}
</tr>
{% endfor %}
</table>
{% endif %}
{% endif %}
{% endblock %}
但是,如果我转到 /admin/foo/object/import/(ObjectAdmin 将是来自 import_export.admin 的 ImportExportModelAdmin 的一个实例),我表单中的输入元素不会显示在管理视图中,即使尽管我在 grappelli 的 .grp-button .grp-default CSS 类 之后对它们进行了建模(并且可以看到 grappelli 在其自己的文档中使用输入元素)
我无法弄明白这部分表格有一些问题:
<div class="grp-module grp-submit-row">
<input type="submit" class="grp-button grp-default" value="{% trans 'Submit' %}">
</div>
导入和导出视图都是如此。我可以看到其余的导入和导出表单,只是看不到表单提交输入。
项目是 Django 版本 1.9
django-grappelli==2.10.1
django-导入-导出==1.0.0
我仍然有兴趣了解为什么表单输入不显示,但我用按钮替换了输入以执行相同的操作,这些显示和管理表单现在可以使用了。
例如,替换:
<input type="submit" value="{% trans 'Submit' %}" class="grp-button grp-default" />
与:
<button type="submit" class="grp-button" title="{% trans 'Submit' %}" value="{% trans 'Submit' %}">{% trans 'Submit' %}</button>
在使用 django-grappelli 为管理员 UI 的项目上实施 django-import-export 后,我发现两个库之间存在一些 CSS 不兼容性:https://github.com/sehmaschine/django-grappelli/issues/435
为了解决这个问题,我创建了自定义管理模板覆盖,因此导入导出使用 grappelli 的 CSS:
/templates/admin/import_export/base.html
{% extends "admin/base_site.html" %}
{% load i18n admin_static admin_modify %}
{% load admin_urls %}
{% block bodyclass %}{{ opts.app_label }}-{{ opts.object_name.lower }} change-form{% endblock %}
{% if not is_popup %}
{% block breadcrumbs %}
<ul>
<li><a href="{% url 'admin:index' %}">{% trans 'Home' %}</a></li>
<li><a href="{% url 'admin:app_list' app_label=opts.app_label %}">{{ opts.app_label|capfirst|escape }}</a></li>
<li><a href="{% url opts|admin_urlname:'changelist' %}">{{ opts.verbose_name_plural|capfirst }}</a></li>
<li> {% block breadcrumbs_last %}{% endblock %}</li>
</ul>
{% endblock %}
{% endif %}
/templates/admin/import_export/change_list.html
{% extends "admin/change_list.html" %}
{% load i18n grp_tags %}
{# Original template renders object-tools only when has_add_permission is True. #}
{# This hack allows sub templates to add to object-tools #}
{% block object-tools %}
<ul class="grp-object-tools">
{% block object-tools-items %}
{% if has_add_permission %}
{{ block.super }}
{% endif %}
{% endblock %}
</ul>
{% endblock %}
/templates/admin/import_export/import.html
{% extends "admin/import_export/base.html" %}
{% load i18n grp_tags %}
{% load admin_urls %}
{% load import_export_tags %}
{% block breadcrumbs_last %}
{% trans "Import" %}
{% endblock %}
{% block content %}
{% if confirm_form %}
<form action="{% url opts|admin_urlname:'process_import' %}" method="POST">
{% csrf_token %}
{{ confirm_form.as_p }}
<p>
{% trans "Below is a preview of data to be imported. If you are satisfied with the results, click 'Confirm import'" %}
</p>
<div class="grp-form-row grp-submit-row">
<input type="submit" class="grp-button grp-default" name="confirm" value="{% trans 'Confirm import' %}">
</div>
</form>
{% else %}
<form action="" method="POST" enctype="multipart/form-data">
{% csrf_token %}
<div>
<div class="grp-form-row"><p>
{% trans "This importer will import the following fields: " %}
<code>{{ fields|join:", " }}</code>
</p></div>
<fieldset class="module aligned">
{% for field in form %}
<div class="grp-form-row">
{{ field.errors }}
<div class="c-1">{{ field.label_tag }}</div>
<div class="c-2">{{ field }}
{% if field.field.help_text %}
<p class="help grp-help">{{ field.field.help_text|safe }}</p>
</div>
{% endif %}
</div>
{% endfor %}
</fieldset>
<div class="grp-form-row grp-submit-row">
<input type="submit" class="grp-button grp-default" value="{% trans 'Submit' %}">
</div>
</div>
</form>
{% endif %}
{% if result %}
{% if result.has_errors %}
<h2>{% trans "Errors" %}</h2>
<ul>
{% for error in result.base_errors %}
<li>
{{ error.error }}
<div class="traceback errornote">{{ error.traceback|linebreaks }}</div>
</li>
{% endfor %}
{% for line, errors in result.row_errors %}
{% for error in errors %}
<li>
{% trans "Line number" %}: {{ line }} - {{ error.error }}
<div><code>{{ error.row.values|join:", " }}</code></div>
<div class="traceback errornote">{{ error.traceback|linebreaks }}</div>
</li>
{% endfor %}
{% endfor %}
</ul>
{% else %}
<h2>
{% trans "Preview" %}
</h2>
<table>
<thead>
<tr>
<th></th>
{% for field in result.diff_headers %}
<th>{{ field }}</th>
{% endfor %}
</tr>
</thead>
{% for row in result.rows %}
<tr>
<td>
{% if row.import_type == 'new' %}
{% trans "New" %}
{% elif row.import_type == 'skip' %}
{% trans "Skipped" %}
{% elif row.import_type == 'delete' %}
{% trans "Delete" %}
{% elif row.import_type == 'update' %}
{% trans "Update" %}
{% endif %}
</td>
{% for field in row.diff %}
<td>
{{ field }}
</td>
{% endfor %}
</tr>
{% endfor %}
</table>
{% endif %}
{% endif %}
{% endblock %}
但是,如果我转到 /admin/foo/object/import/(ObjectAdmin 将是来自 import_export.admin 的 ImportExportModelAdmin 的一个实例),我表单中的输入元素不会显示在管理视图中,即使尽管我在 grappelli 的 .grp-button .grp-default CSS 类 之后对它们进行了建模(并且可以看到 grappelli 在其自己的文档中使用输入元素)
我无法弄明白这部分表格有一些问题:
<div class="grp-module grp-submit-row">
<input type="submit" class="grp-button grp-default" value="{% trans 'Submit' %}">
</div>
导入和导出视图都是如此。我可以看到其余的导入和导出表单,只是看不到表单提交输入。
项目是 Django 版本 1.9 django-grappelli==2.10.1 django-导入-导出==1.0.0
我仍然有兴趣了解为什么表单输入不显示,但我用按钮替换了输入以执行相同的操作,这些显示和管理表单现在可以使用了。
例如,替换:
<input type="submit" value="{% trans 'Submit' %}" class="grp-button grp-default" />
与:
<button type="submit" class="grp-button" title="{% trans 'Submit' %}" value="{% trans 'Submit' %}">{% trans 'Submit' %}</button>