Django ajax redirect opening in same div

Question

I'm using Django 2.0

I am making Ajax request to FormView to render template inside <div> and want to redirect in certain case.

<script>
function loadNextQuestion() {
    $('#question-box').load("{% url 'learn:question' course_learn.pk %}?session="+$('#session-id').val(), function(){
       // other stuffs
    });
}
</script>

and the view is like

class LearnQuestion(FormView):
    form_class = SessionForm
    template_name = 'learn/learn_question.html'

    def get_context_data(self, **kwargs):
        context = super(LearnQuestion, self).get_context_data(**kwargs)
        course_learn = CourseLearn.objects.get(pk=self.kwargs['course_learn_id'])

        session = self.request.GET['session']
        question, question_type, options, complete = CourseLearn.objects.get_next_question(course_learn, session)

        if complete:
            context['complete'] = complete
            context['course_learn'] = course_learn
            context['session'] = session

            return context

        context['question'] = question
        context['question_type'] = question_type
        context['options'] = options
        context['course_learn'] = course_learn
        context['session'] = session
        context['complete'] = complete

        return context

    def render_to_response(self, context, **response_kwargs):
        if context['complete']:
            return redirect(reverse('learn:success',
                            kwargs={
                                'course_learn_id': context['course_learn'].pk,
                                'session': context['session']
                            }))
        return super(LearnQuestion, self).render_to_response(context, **response_kwargs)

which renders learn/learn_question.html template inside question-box <div> but redirects when context['complete'] is True

This works good but on redirect, the template of redirected URL is rendering in same <div id="question=box">

How can I redirect to a complete new page instead of rendering in same <div>?

Since it's AJAX, Django has little role in this. You'll have to do it in JavaScript. See https://stackoverflow.com/questions/503093/how-do-i-redirect-to-another-webpage — xyres, Apr 29 '18 at 07:07

Sidhin S Thomas · Accepted Answer · 2018-04-29T09:45:44.613

The redirection won't work. Since normally when you return the HTTP response Redirect, a special kind of HTTP response is sent to browser. Which it interprets and redirects.

This works only when making a traditional request since, in that case, browser handles the response.

Here the situation is that, you are making an AJAX call.

So you have to check the response code of what you receive in JavaScript.

https://stackoverflow.com/a/17436256/4929982

$.ajax( url [, settings ] )
.always(function (jqXHR) {
    console.log(jqXHR.status);
});

Then redirect in case it is redirect ( code: 301 or 302).

Redirect using:

 window.location.replace('your_url') ;

You should get your_url from the response object.

Django ajax redirect opening in same div

1 Answers1