Как я могу отправить данные в локальное хранилище из JavaScript ajax вызова и вывести возвращаемые данные из представления в шаблоне Django

Я сохранил некоторые данные в localStorage (Itemnames и ItemIds), теперь я хочу отправить itemid's в django views из ajax. У меня есть базовые знания о django и изучение Javascript. Я пытался разобраться в этом самостоятельно, но уже более 4 дней не могу добиться успеха, любая помощь будет высоко оценена.

Мой Javascript:

$(document).ready(function() {
    var compare = localStorage.getItem("comparisionItems");
    var compareObj = JSON.parse(compare);
    
    var data_url = window.location.href;
    console.log(compare)
    console.log(compareObj)
    
   
      
      $.ajax({
        url: './compare',
        type: "POST",
        data: {'compare_id': compareObj },
        headers: { "X-CSRFToken": $.cookie("csrftoken") },
        dataType: "json",
        success: function (data) {
            console.log(data)
            
        },
        error: function () {
            alert("Some problem on passing data");
        }
        
    });
});

After getting the localstorageitmes, the console return looks like this:

Мои взгляды:

def compare(request):
is_ajax = request.headers.get('X-Requested-With') == 'XMLHttpRequest'
if is_ajax and request.method == "POST":
    compare_id= request.POST.getlist('compare_id[itemIds]')
    """compare_id=request.POST.getlist('itemIds[]')  """
   
    """compare_id = request.POST.get('compare_id')"""
    product = get_object_or_404(Products, id=compare_id)
    context={ 'product':product}
   
    """ return render (request, './ecommerce/compare.html', context)"""
    return render (request, './compare.html', context)
else:
    context = None
    return render(request,'./compare.html', context)

Как я могу получить товары, у которых есть id, переданные ajax? И есть ли другие способы передать эти продукты в шаблон или я могу сделать это как обычный контекстный процесс Django?

В вашем ajax вы должны строчить часть данных следующим образом:

 $.ajax({
    // rest of the code
    data: JSON.stringify({'compare_id': compareObj}),
    headers: { "X-CSRFToken": $.cookie("csrftoken") },
    dataType: "json",
    contentType: "application/json",
    // rest of the code
});

А затем, по вашему мнению: 

import json

def compare(request):
   is_ajax = request.headers.get('X-Requested-With') == 'XMLHttpRequest'
   if is_ajax and request.method == "POST":
      compare_id = json.loads(request.POST.get('compare_id'))
      ids = compare_id.get('compare_id')
      # ids will be list of ids and you can get first id with index
      product = get_object_or_404(Products, id=ids[0])
      # rest of code

Передайте json-строку из вашего ajax-запроса.

$.ajax({
    url: './compare',
    type: "POST",
    data: JSON.stringify({'compare_id': compareObj }),
    headers: { "X-CSRFToken": $.cookie("csrftoken") },
    dataType: "json",
    contentType : "application/json",
    success: function (data) {
        console.log(data)
        
    },
    error: function () {
        alert("Some problem on passing data");
    }
});

А в вашем views.py

Сначала получить POST-данные

 import json

data = json.loads(request.body)
compare_ids = data['compare_id'] if 'compare_id' in data else []
# since multiple ids may come you need to use `filter` 
products = Products.objects.filter(id__in=compare_ids)
Вернуться на верх