title: Show form validation error for User login on Modal itself- Django
body: <p>Although my User login is working perfectly fine but I am unable to handle User form validation on modal itself. I mean, I am able to get the user name and pwd and validate it but if the user name and pwd didn't match, the page is redirected to a Django template. But I want to show the message like <code>username pwd didn't match</code> on modal itself not on another Django template.</p>
  
  <p><strong>Modal code</strong></p>
  
  <pre><code>&lt;div class="modal signUpContent fade" id="ModalLogin" tabindex="-1" role="dialog"&gt;
  &lt;div class="modal-dialog "&gt;
      &lt;div class="modal-content"&gt;
          &lt;div class="modal-header"&gt;
              &lt;button type="button" class="close" data-dismiss="modal" aria-hidden="true"&gt; &amp;times; &lt;/button&gt;
              &lt;h3 class="modal-title-site text-center"&gt; Login &lt;/h3&gt;
          &lt;/div&gt;
          &lt;div class="modal-body"&gt;
              {% if form.errors %}
              &lt;p&gt;Your username and password didn't match. Please try again.&lt;/p&gt;
              {% endif %}
  
              {% if next %}
                  {% if user.is_authenticated %}
                  &lt;p&gt;Your account doesn't have access to this page. To proceed,
                  please login with an account that has access.&lt;/p&gt;
                  {% else %}
                  &lt;p&gt;Please login to see this page.&lt;/p&gt;
                  {% endif %}
              {% endif %}
              &lt;form action="{% url 'django.contrib.auth.views.login' %}" method="post"&gt;
                  {% csrf_token %}
                  {% if next %}
                    &lt;input type="hidden" name="next" value="{{ next }}" /&gt;
                  {% endif %}
                  &lt;div class="form-group login-username"&gt;
                      &lt;div&gt;
                          &lt;input name="username" id="login-user" class="form-control input" size="20" placeholder="Enter Username" type="text" value="{{ username }}"&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="form-group login-password"&gt;
                      &lt;div&gt;
                          &lt;input name="password" id="login-password" class="form-control input" size="20" placeholder="Password" type="password" value=""&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="form-group"&gt;
                      &lt;div&gt;
                          &lt;div class="checkbox login-remember"&gt;
                              &lt;label&gt;
                                  &lt;input name="rememberme" value="forever" checked="checked" type="checkbox"&gt;
                                  Remember Me
                              &lt;/label&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div&gt;
                      &lt;div&gt;
                          &lt;input name="submit" class="btn  btn-block btn-lg btn-primary" value="Log In" type="submit"&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
          &lt;/form&gt;
          &lt;/div&gt;
  
          &lt;div class="modal-footer"&gt;
              &lt;p class="text-center"&gt; Not here before? &lt;a data-toggle="modal" data-dismiss="modal" ng-href="#ModalSignup"&gt; Sign Up. &lt;/a&gt; &lt;br&gt;
                  &lt;a data-toggle="modal" data-dismiss="modal" ng-href="#ModalPwdReset"&gt; Lost your password? &lt;/a&gt; &lt;/p&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p><strong>setting.py</strong></p>
  
  <pre><code>LOGIN_URL = '/login/'
  LOGIN_REDIRECT_URL = '/index'
  </code></pre>
  
  <p>So, how to get error message on modal form itself ?</p>