【问题标题】:How to update django template variable without reloading page (AJAX)?如何在不重新加载页面(AJAX)的情况下更新 django 模板变量?
【发布时间】:2017-06-14 02:17:48
【问题描述】:

这个上下文处理器

def cart_proc(request):
    return (dict(cart=Cart(request)))

在我的模板中给了我变量 {{cart}},所以我可以在 base.html 中使用 {{ car​​t.count }}。 count 是计算购物车中产品数量的方法。
这是我的js

function addProduct(){
$('form.add-product').on('submit', function(){
    var link = $(this)
    var quantity = $(this).find('#id_quantity').val()
    $.ajax({
        'url': link.attr('action'),
        'type': 'POST',
        'dataType': 'json',
        'data': {
            'quantity': quantity,
            'csrfmiddlewaretoken': $('input[name="csrfmiddlewaretoken"]').val()
        },
        'success': function(data, status, xhr){
            alert('Success');
            return false;
        },
        'error': function(xhr, status, error){
            alert('Error on server. Please try again later.');
            return false;
        }
    });
    return false;
});
}

我的观点(我使用 django-cart 作为我的购物车)

def add_to_cart(request, id):
    form = QuantityForm(request.POST)
    if form.is_valid():
        product = Product.objects.get(id=id)
        quantity = request.POST['quantity']
        cart = Cart(request)
        cart.add(product, product.price, quantity)
       return JsonResponse({'status': 'success'})

当我使用 AJAX 在购物车中添加产品时,我想更新 {{cart.count}},而不需要重新加载页面。现在它只有在重新加载后才会更新。

【问题讨论】:

    标签: jquery python ajax django


    【解决方案1】:

    我认为您对 django 应用程序如何与您的客户端进行通信有一点误解。您必须了解请求响应生命周期。

    您的模板上下文仅存在于请求响应生命周期内。来自您的客户端的每个请求都将启动一个具有新模板上下文的新工作人员以生成响应。您的客户端应用程序和 django 之间没有持久的状态连接

    这意味着如果您想更新您的客户端页面而不重新加载它(再次请求它),您必须将新卡计数与您的 JsonResponse 一起传递给客户端,并让处理响应的 javascript 代码更新显示值。

    【讨论】:

    • 我做到了。谢谢你的解释。
    • 如何通过代码示例做到这一点?我成功更新了数量,但不确定如何访问其他值。
    【解决方案2】:

    你不能。一旦页面被渲染,所有模板变量都会消失。您可以使用input hidden 来存储cart.count 值,然后更新该值。

    【讨论】:

      猜你喜欢
      • 2010-12-22
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-06-04
      • 2021-07-17
      • 2019-07-25
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多