Как обновить несколько идентификаторов в HTML с помощью Ajax Javascript для проекта Django

Я пытаюсь отправить 2 ответа, чтобы 2 части HTML могли быть обновлены без обновления всей страницы.

Вот ajax:

$.ajax({
    type:'POST',
    url:'{% url 'app:bla' %}',
    data:{'active' : status, 'csrfmiddlewaretoken':'{{csrf_token}}'},
    dataType:'json',
    success:function(response){
        $('#start').html(response['form']),
         //I am trying to refresh #log_form also the same way same #start gets refreshed                       
        //$('#log_form').html(response['form2']),
        //What else should I add here to change the id of another part of the html called #log_form
        console.log($('#start').html(response['form']));
    },
    error:function(rs, e){
        console.log(rs.responseText);
    },
});

Вот часть представлений, чтобы объяснить, что я делаю

def change_status(request, id):
    if request.is_ajax() and request.method == 'POST':
        if request.POST.get('active') == 'true':
            # .......do stuff
            context = {
                'active': ''
            }
            html = render_to_string('app/button.html', context,request=request)
            html2 = render_to_string('app/log_form.html', context,request=request)
            return JsonResponse({'form': html}, {'form2': html2})
        else:
            print("Fail")
    else:
        print("Fail")

Теперь, когда я нажимаю определенную кнопку #start обновляется только страница, а не вся страница.

Мой вопрос: Как я могу получить #log_form также освежиться вместе с #start одновременно.

Добавьте код того, как вы запускаете $.ajax() при нажатии на определенную кнопку #start. Вам нужно добавить event.preventDefault(), чтобы избежать действия кнопки по умолчанию, которое может быть причиной полной перезагрузки страницы. В том же месте вы можете вызвать действие #log_form, каким бы оно ни было

Добавьте код того, как вы запускаете $.ajax() при нажатии на определенную кнопку #start. Вам нужно добавить event.preventDefault(), чтобы избежать действия кнопки по умолчанию, которое может быть причиной полной перезагрузки страницы. В том же месте вы можете вызвать действие #log_form, каким бы оно ни было

$("#log_form").load(location.href+" #log_form >*","");

Попробуйте этот, я использовал его в похожих ситуациях, когда мне нужно было обновить div только при успехе ajax.

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