Использование тега django url внутри jquery ajax

Question

Я создаю страницу, которая содержит несколько категорий, и когда пользователь нажимает на ссылку, я продолжаю и извлекаю детали для этой конкретной категории (продукты этой категории). Я думал, что сделать это можно с помощью jQuery Ajax. В любом случае, часть, где я добавляю свои данные, выглядит следующим образом:

...
$.ajax({
    ...
    success: function(results) {
        $("#cards").empty();
        for (let iterator = results.length -1; iterator>=0; iterator--) {
            $("#cards").append(
            '<a href="{% url "product" '+results[iterator].id+' %}">'
            +'<div>'
            +    '<div class="card mb-5 shadow-sm">'
            +        '<img class="card-img-top"'
            +             'src="'+results[iterator].image+'" />'
            +        '<div class="card-body">'
            +            '<h5 class="card-title">'+results[iterator].name+'</h5>'
            +            '<p class="card-text">'+results[iterator].price+'</p>'
            +        '</div>'
            +    '</div>'
            +'</div>'
            +'</a>'
            );
        }
    },
    ...
});
...

На основе этого блока кода я получаю эту ошибку:

Reverse for 'product' with arguments '('+results[iterator].id+',)' not found. 1 pattern(s) tried: ['(?P<id>[0-9]+)/$']

Поскольку я получаю resultsв форме json у меня нет проблемы с его использованием так, как я это делал, но проблема возникает при добавлении тега a вокруг моего контейнера div. Я не понимаю, какой курс действий мне следует предпринять, поскольку у меня нет опыта ни с Django, ни с jQuery.

Answer 1

Вы не можете смешивать шаблоны Django и JavaScript таким образом. Шаблон Django отображается на стороне сервера, JavaScript выполняется в браузере.

Когда механизм шаблонов Django анализирует {% url "product" '+results[iterator].id+' %}, он обрабатывает '+results[iterator].id+' как строку и передает ее как есть url тег шаблона. Но эта строка не соответствует шаблону URL, поэтому вы получаете эту ошибку.

Существуют различные решения того, что вы пытаетесь сделать. Подход, который, вероятно, требует наименьших изменений, заключается в возврате URL-адресов продуктов в ответ на ваш запрос Ajax. Чтобы ответить, как именно это сделать, вы должны опубликовать свое мнение.