无法在Django AJAX 调用中检索模板中的变量

icomxhvb 于 2022-12-14 发布在 Go

关注(0)|答案(1)|浏览(99)

我正在尝试检索从html模板中的视图传递的计数器值。它是作为无来的，但在视图打印和 AJAX 成功日志值中，它是正确的。
JS AJAX 函数

$(".pos").click(function(){
            counter=counter+1;
            $(".add").html('add counter '+counter);
            $.ajax(
                { url :'page',
                  type :'get' ,
                 
                  data:{
                    quantity: counter
                   },
                    
                success:function(response){
                  console.log(response);
                }

                   
                   

                }
            );

我的观点

def page(request):
    counter=request.GET.get('quantity')
    print(counter) ## this is printing fine
    return render(request,'page.html',{'counter':counter})

html模板

<body>
    {{counter}}
    <button class="btn neg" name="neg-btn">-</button>
    <button class="btn add" name="add-btn" >add to box</button>
    <button class="btn pos" id="test" name="pos-btn">+</button>
</body>

将此计数器设为None

django

来源：https://stackoverflow.com/questions/74760422/not-able-to-retrieve-variable-in-template-in-django-ajax-call

1条答案

按热度按时间

snvhrwxg1#

通常你会有两个视图，一个用于呈现模板，另一个用于 AJAX 请求，这有助于让你的代码更有条理，让函数只做一个任务，就像它的命名中描述的那样。
在视图中发生的一件重要的事情是，您返回的是由呈现API生成的HTML，而不是计数器值。当然，有很多方法可以正确地做到这一点，但这里有一个可能的解决方案：
page.html

{% extends 'base.html'%}

{% block content %}
<body>
    <div id="counter">
        {{counter}}
    </div>
    
    <button class="btn neg" id="neg" name="neg-btn">-</button>
    <button class="btn add" id="add" name="add-btn" >add to box</button>
    <button class="btn pos" id="pos" name="pos-btn">+</button>
</body>
{% endblock content %}

{% block script %}
<script>
    let counter = parseInt("{{counter}}");
    let page_url = "{% url 'core:page' %}";
    console.log(page_url)
    $( "#pos" ).click(function() {
        counter += 1;
        $( "#counter" ).replaceWith(`<div id="counter">${counter}</div>`);
    });
    $( "#neg" ).click(function() {
        counter -= 1;
        $( "#counter" ).replaceWith(`<div id="counter">${counter}</div>`);
    });
    $( "#add" ).click(function() {
        $.ajax({ 
                    url :page_url,
                    type :'post' ,
                    data:
                    {
                        counter: counter,
                        csrfmiddlewaretoken: '{{ csrf_token }}',
                    },                    
                    success:function(response){
                    console.log(response);
                    }
                });
    });
</script>
{% endblock script %}

views.py

from django.http import JsonResponse

def page(request):
    counter = 0
    if request.method == 'POST':
        counter = int(request.POST.get('counter'))
        print(counter)
        return JsonResponse({'counter': counter})
    
    return render(request,'page.html',{'counter':counter})

赞(0）回复(0）举报 2022-12-14

我来回答

无法在Django AJAX 调用中检索模板中的变量

1条答案

相关问题

热门标签

最新问答