我需要访问一个javascript文件中的服务器数据,该文件将加载一个管理页面。在我的情况下,我需要一个在settings.py
文件中设置的json变量(在生产版本中,这个json变量是从env变量加载的,这意味着该变量的内容在启动时是已知的,但不是硬编码的(。
我使用javascript来验证和填充管理页面中的一些字段——这是一个比在服务器端更好的用户体验。
是否可以将脚本标记添加到admin-html页面的头部,其中包含服务器数据,即非静态数据?
如果我正确理解你的问题,你需要从网站向管理员发送一些数据,是的,有多种方法可以做到这一点
- 制作一个API来提供数据,并使用ajax从管理员处获取数据
- 将数据添加到页面的上下文中,并直接在管理员中使用
在这两种方式中,你都需要编辑管理员并添加一些js代码,所以这就是我在这里向你展示的
编辑管理员
首次批准
在这里,我们将在静态文件中创建一个js文件,然后使用admin 中Media类中的js变量导入
class TestAdmin(admin.ModelAdmin):
class Media:
js = ('js/some_js_file.js',)
然后编写一个API来提供您的数据,并从js 中使用它
第二种方法
我们将扩展add表单模板,并直接在模板中编写js代码
{% extends 'admin/change_form.html' %}
{% block extrahead %}{{ block.super }}
# write code here
{% endblock %}
并且在管理员中
class TestAdmin(admin.ModelAdmin):
add_form_template = 'path_to_template'
注意:您需要在设置中启用模板
现在,如果您不喜欢API方法,您可以覆盖adminadd_form函数并添加需要的上下文
class TestAdmin(admin.ModelAdmin):
add_form_template = 'admin/test_form_Change.html'
def changeform_view(self, request, object_id=None, form_url='', extra_context=None):
extra_context = extra_context or {}
extra_context['some_data'] = 'value'
return super(TestAdmin, self).changeform_view(request, object_id, extra_context=extra_context)
你可以用这个标签将数据添加到模板
Mina Atef的回答帮助我完成了这项工作。谢谢米娜·阿提夫。
这是我使用的确切代码,以防对某人有所帮助。这适用于Django 4.1。我需要在列表视图中使用此方法,但您也可以在详细信息视图中使用这种方法。
添加到管理类:
class PlaceNameAdmin(admin.ModelAdmin):
# A lof of code not shown
class Media:
# Adding the javascript file
js = ('multi_line_list_edit.js',)
def changelist_view(self, request, extra_context=None):
extra_context = extra_context or {}
# Adding the extra context. It comes from settings but it can be any dynamic data.
# The REGISTER_PLACES_SETTINGS is actually not static, since it comes
# from env-variable that is set in production docker environment.
extra_context['register_places_settings'] = settings.REGISTER_PLACES_SETTINGS
return super(PlaceNameAdmin, self).changelist_view(request, extra_context)
需要将名为change_list.html
的文件添加到templates/admin/
目录中。有关如何覆盖管理模板的更多信息,请参阅django文档。
{% extends "admin/change_list.html" %}
{% block extrahead %}
{{ block.super }}
{% comment %}
See docs.djangoproject.com/en/4.1/ref/templates/builtins/#json-script for doc on how to use json_script
{% endcomment %}
{{ register_places_settings|json_script:"register_places_settings" }}
{% endblock %}
以下是如何在multi_line_list_edit.js
中使用数据。这个javascript文件需要放在static/
目录中。
$(document).ready(function() {
const register_places_settings = JSON.parse(document.getElementById('register_places_settings').textContent);
// A lof of code not shown
});