Django：序列化 QuerySet 并将其发送到模板以与 Javascript 一起使用

Question

我有一个 QuerySet，我需要将它发送到我的模板，因为我需要操纵它的值来生成一个 JS 数组。

但在我看来，我使用：

 order_items = json.dumps(order_items)

我明白了：

Object of type QuerySet is not JSON serializable

查看：

import json

def thanks_deposit_payment(request):

    order_number = Order.objects.latest('id').id
    total = Order.objects.latest('id').total
    costo_despacho = Order.objects.latest('id').shipping_cost
    order_items = OrderItem.objects.filter(order=Order.objects.latest('id'))
    # order_items = json.dumps(order_items)

    response = render(request, 'thanks_deposit_payment.html', dict(order_number=order_number, total=total,
                                                                   order_items=order_items, costo_despacho=costo_despacho))
    return response

models.py：

class OrderItem(models.Model):
    order = models.ForeignKey(Order, on_delete=models.CASCADE)
    product = models.CharField(max_length= 200)
    quantity = models.CharField(max_length= 200)
    size = models.CharField(max_length=200)
    price = models.DecimalField(max_digits=10, decimal_places=2, verbose_name= 'PEN Price')
    file = models.FileField(upload_to='files', blank=True, null=True)
    comment = models.CharField(max_length=200, blank=True, null=True, default='')
    uploaded_at = models.DateTimeField(auto_now_add=True)

    class Meta:
        db_table = "OrderItem"

我需要使用从后端发送的 order_items 中的项目生成 products 数组：

 <script>
        window.dataLayer = window.dataLayer || [];
        window.dataLayer.push({
            event: 'eec.purchase',
            ecommerce: {
                currencyCode: 'PEN',
                purchase: {
                    actionField: {
                        id: {{ order_number }},
                        affiliation: 'Stickers Gallito E-Commerce',
                        revenue: {{ total }},
                        shipping: {{ costo_despacho }},
                        coupon: 'SUMMER2019'
                    }
                },
                products: [

    {% for item in order_items %}
                  {
                    id: item.order.id,
                    name: item.product,
                    price: item.price,
                    size: item.size,
                    quantity: item.quantity
                  },
    {% endfor %}
                ]
            }
        });
    </script>

更新 1：

使用 ruddras 回答，我正在做：

def thanks_deposit_payment(request):
    order_number = Order.objects.latest('id').id

    total = Order.objects.latest('id').total

    costo_despacho = Order.objects.latest('id').shipping_cost

    order_items = OrderItem.objects.filter(order=Order.objects.latest('id'))
    order_items = json.dumps(serialize('json', order_items))

    response = render(request, 'thanks_deposit_payment.html', dict(order_number=order_number, total=total,
                                                                   order_items=order_items, costo_despacho=costo_despacho))
    return response

但出现错误：

VM1835:1 Uncaught SyntaxError: Unexpected token & in JSON at position 0 在 JSON.parse() 在（索引）：55

在 thanks_deposit_payment.html 中：

{% block data_layer %}

<script>
    window.dataLayer = window.dataLayer || [];
    window.dataLayer.push({
        event: 'eec.purchase',
        ecommerce: {
            currencyCode: 'PEN',
            purchase: {
                actionField: {
                    id: {{ order_number }},
                    affiliation: 'Stickers Gallito E-Commerce',
                    revenue: {{ total }},
                    shipping: {{ costo_despacho }},
                    coupon: 'SUMMER2019'
                }
            },
            products: JSON.parse('{{ order_items }}')
        }
    });
</script>

{% endblock %}

更新 2

Chrome Web 开发者工具中的控制台标签：

VM2315:1 Uncaught SyntaxError: Unexpected token & in JSON at position 2
    at JSON.parse (<anonymous>)
    at (index):55

来源选项卡（第 55 行）：

products: JSON.parse('[{"model": "order.orderitem", "pk": 8, "fields": {"product": "Sobre con muestras", "price": "3.00"}}]')

Answer 1

您可以使用Django JSON Serializer 将查询集转换为 JSON 字符串：

from django.core.serializers import serialize
order_items = OrderItem.objects.filter(order=Order.objects.latest('id'))
order_items = serialize('json', order_items, fields=['id', 'product', 'price'])  # the fields needed for products

然后在模板中使用：

 products: JSON.parse('{{ order_items | safe }}')

Answer 2

试试这个：

def thanks_deposit_payment(request):
 order_number = Order.objects.latest('id').id
 total = Order.objects.latest('id').total
 costo_despacho = Order.objects.latest('id').shipping_cost
 order_items = OrderItem.objects.filter(order=Order.objects.latest('id'))

 return JSONResponse(...here goes the dict with all data to send to view)

甚至，如果你想发送所有这些查询集，你可以在一个字典中发送一个字典。） 稍后，我建议您将 AJAX 与 JQuery 一起使用。