0

I want to refresh particular section(which contains form) in html page and not the whole page in Django templates.form contains question and choices when user submit the form it redirect to next question.(base.html contains script which i used to create countdown timer)

question_details.html

{% extends 'app/base.html' %}
{% block content %}
<div>    
   <h2>score -{{user.userextend.score}}</h2>
   <form action="{% url 'app:detail' quiz_id=que.quiz.id question_id=que.id %}" method="post" id="user_form">
      {% csrf_token %}
      {% for choice in que.answer_set.all %}
          <input type="radio" name="choice" id="choice{{ forloop.counter }}" value="{{ choice.id }}">
          <label for="choice{{ forloop.counter }}">{{ choice.answer }}</label><br>

      {% endfor %}
      <input type="submit" value="Next">
   </form>
</div>
{% endblock %}
ROOT
  • 11,363
  • 5
  • 30
  • 45
Swapnil Mangaonker
  • 61
  • 1
  • 8
  • https://stackoverflow.com/questions/21133135/django-update-part-of-the-page You might find your answer here – ssomename May 28 '20 at 05:24

2 Answers2

0

Django templates aren't designed to behave like an AJAX application or a SPA. They are made to follow the traditional request/response cycle, which includes full page reloads. It can be made to work but you'll need to use AJAX or some other JavaScript library.

Asher
  • 677
  • 5
  • 10
0

Forms have a default reload function on submit. For example while using Forms in react. I can tell the component not to reload page when the submit button is clicked.

ex: 

    onSubmit = { (e) => { 
        e.preventDefault(); 
        //call function here to update elements
        updateElement(data);
    }}

Which stops the default behavior of page reload when the submit button is clicked.

Cijin Cherian
  • 70
  • 7
  • After you prevent the default functionality of the form, call the function that updates the elements on the page that you want to. I've edited my answer to show how. – Cijin Cherian May 29 '20 at 04:37