如何通过 javascript 从管理页面检索 Django 模型 ID答案

【问题标题】：How to retrieve Django model id from admin page via javascript如何通过 javascript 从管理页面检索 Django 模型 ID
【发布时间】：2020-01-24 06:33:42
【问题描述】：

假设我有一个像这样的 Django 模型。

class Car(models.Model):
    speed = models.IntegerField()
    color = models.CharField(max_length=120)

我通过 admin 注册了它

admin.site.register(Car)

我想为管理站点对象视图添加自定义 JS 按钮，这将提醒汽车模型实例的颜色值。所以当我按下它时，我会得到类似“ID 13的汽车是red”

如何通过 JavaScript 获取对象的 id 和颜色字段的值？

【问题讨论】：

你可以保存点击按钮检查这是否好def __str__(self): return f"The car with id {self.id} is {self.color}"
抱歉，这行不通。这只是一个示例，实际上有很多字段，例如 color，其中包含很长的值。
您想要汽车型号列表中的这个按钮边吗？
不在列表中，但在对象视图中，靠近color 字段

标签： javascript python django reactjs django-admin

【解决方案1】：

您必须为您的应用扩展 change_form.html 模板 (https://docs.djangoproject.com/en/2.2/ref/contrib/admin/#overriding-vs-replacing-an-admin-template)

例如，我有store 应用程序，在models.py 里面我放了Car 模型。

然后在store/templates/admin/store/change_form.html里面我放了这个模板：

{% extends "admin/change_form.html" %}
{% load i18n admin_urls %}

{% block content %}
{{ block.super }}
        <script>
                const object = {
                        pk: {{ original.pk }},
                        color: '{{ original.color }}',
                };
        </script>
{% endblock %}

{% block object-tools-items %}
{{ block.super }}

<li>
        <a href="" id="my-button">My button</a>
        <script>
                const button = document.getElementById('my-button');
                button.addEventListener('click', function() {
                        alert(`The car with ${object.pk} is ${object.color}`); 
                });
        </script>
</li>

{% endblock %}

管理员视图：

【讨论】：

啊哈，所以它可以通过模板中的 {{ original }} 获得。太好了，谢谢！