Using the Django URL Tag in an AJAX Call

Django is a server-side application. Javascript is client-side. Django templates get rendered on the server, so {% url entity_name id_number %} is evaluated on the server side, and then it's value is returned to the client. Just because of this, it's impossible for you to combine Django templates with javascript. However there are couple of things you can do to solve your problem.

Since you are making an ajax call, and the ajax call depends on some user input, usually the best route for the client to send any type of user input to the server is by either using querystring (thing after ? in the URL) or by sending a POST data. So the simplest thing is to change your your url not to include the pk in the url, but for the view to get that as part of GET or POST data.

url(r'ajax/entity_name/$', EntityAjaxView.as_view(), name='entity_name'),

and the view (sorry I'm not familiar with class based views):

def entity_name(request):    pk = request.GET.get('pk')    ...

That seems to me to be the most elegant solution. If however you absolutely need to construct the url on the client side, you can generate a template url on the server side and then replace whatever parts you need on the client side to get the full url. This however requires more maintenance and therefore is more error prone. Simple js example of this approach:

var id_number = $('#id_endowmententity_set-' + rownum + '-id_number').val(),    url = '{% url entity_name 0 %}'.replace('0', id_number);$.ajax({    type: "GET",    url: url,    ...});

It is possible to set an Ajax url on the element you are selecting using an attribute and it will behave like Django urls. Importantly, you can even access the url in Javascript file. I use it a lotHTML

<div class="card-body" id="js-products" data-url="{% url 'chart-data' %}">    <div class="chart-area">      <canvas id="testChart"></canvas>    </div>  </div>

Note: the data-url attribute set on parent divJAVASCRIPT

$(document).ready(function () {var endpoint = $("#js-products").attr("data-url");var defaultData = [];var labels = []$.ajax({    method: 'GET',    url: endpoint,    success: function (data) {        labels = data.labels        defaultData = data.data_default        setChart()    },    error: function (error_data) {        console.log(error_data)    }})function setChart() {    var ctx = document.getElementById('testChart').getContext('2d');    var myChart = new Chart(ctx, {        type: 'line',        responsive: true,        data: {            labels: labels,            datasets: [{                label: 'Monthly Performance',                data: defaultData,            }]        },        options: {            scales: {                yAxes: [{                    ticks: {                        beginAtZero: true                    }                }]            }        }    }); }});

DJANGO VIEWSAm using django rest framework class view but you can use either of function or class based view class ChartData(APIView):

authentication_classes = []permission_classes = []def get(self, request, format=None):    labels = ['Products', 'User', 'May']    data_default = [SeedProduct.objects.all().count(),                    User.objects.all().count(), 4]    data = {        'labels': labels,        'data_default': data_default,    }    return Response(data)

DJANGO URLS:import the view class from views

path('api/chart/data', views.ChartData.as_view(), name="chart-data"),

It's pretty time consuming to go round trip to a server just to fetch a URL. The best strategy to keep URLs dry and avoid this is to generate javascript that emulates Django's native url reverse function and then serve that code statically with the rest of your client side JS.

django-render-static does just that.