Javascript async отправляет запрос в базу данных Django, затем обновляет тот же html-шаблон

Предположим, мне нужно что-то отправить javascript асинхронно без обновления страницы.

name.html

{%if names%}
   {%for name in names%}
       <h4>{{name}}</h4>
   {%endfor%}
{%endif%}

В файле name.html я собираюсь отправить "Joe" моему бэкенду Django для запроса

let crsf = '{{csrf_token}}'
fetch('{%url "name"%}', {
credentials: 'same-origin',
headers: {
   'X-CSRFToken': crsf,
   'Content-Type': 'application/json',
   'Accept': 'application/json, text/plain, */*'},
method: 'POST', 
body: JSON.stringify({
         joe: "Joe", 
}),}).then(res=>console.log(res))

Теперь "Joe" был отправлен на бэкэнд

В views.py:

def name(request):
    names = Names.objects.all()
    paginator = Paginator(names, 100)
    page = request.GET.get('page')
    paged_names = paginator.get_page(page)
    context = {
                    'names':paged_names,
                }
    if request.method == 'POST':
        data = json.loads(request.body.decode("utf-8"))
        joe = data.get("joe")
        names = Names.objects.all()
        names = names.filter(name__iexact=joe)
        context = {
                    'names':names,
                }
        # return render(request, 'cool/names.html', context)

    return render(request, 'cool/names.html', context)

Теперь у меня есть все имена с именем "Джо", запрошенные из базы данных.

Вопрос: Как мне затем отобразить всех "Джо" в name.html, а также сделать так, чтобы пагинация работала как положено, предполагая, что есть более 20k "Джо".

Вернуться на верх