Create custom button in django template from jquery append() method

After the fetch of data returned by an API, I append data into django template, and I also create a button which contains already the url of the detail page specified in urls.py.

The detail page has this url: http://127.0.0.0:8000/blog/<int:user_id>/<int:year>/<int:month>/<int:article_id>, so for example: http://127.0.0.0:8000/blog/1/2022/8/1

I'm trying to add a django url in this way (jquery):

for(var i=0; i < data.articles.length; i++){
   var item = $('<p>Titolo: '+data.articles[i].title+'<br>Autore: '+data.articles[i].author
      +'<br>Data: '+data.articles[i].pub_date+'</p><a id="button_' + data.articles[i].id 
      + '"><button class="btn btn-primary">Dettaglio</button></a>');

   $('#article_list').append(item);

   $("#button_" + data.articles[i].id).attr('href', 
      "{% url 'blog:detail' "+ data.path_info.user_id +" "+ data.path_info.year +" "+ data.path_info.month +" "+ data.articles[i].id +"%}");
}

Analyzing the html page I see: <a id="button_1" href="{% url 'blog:detail' 1 2022 8 1%}"><button class="btn btn-primary">Dettaglio</button></a>, which is correct

When I click the button, Django returns this error:

The current path, blog/1/2022/{% url 'blog:detail' 1 2022 8 1%}, didn’t match any of these. 

http://127.0.0.1:8000/blog/1/2022/%7B%25%20url%20'blog:detail'%201%202022%208%201%25%7D

N.B.: data.path_info contains correct info about the path tags to use.

How can I do to reach the correct path specifying it into jquery?

Back to Top