title: Django form is not displaying
body: <p>I am new to django forms and while trying to design an HTML form, I notice that the django form blocks are not displaying. Below are the codes:</p>
  
  <p><code>&lt;body&gt;</code> tag of index.html:</p>
  
  <pre><code>&lt;div class="container"&gt;
      &lt;div class="row"&gt;
          &lt;div class="col-md-6 col-md-offset-3"&gt;
              &lt;div class="panel panel-login"&gt;
                  &lt;div class="panel-heading"&gt;
                      &lt;div class="row"&gt;
                          &lt;div class="col-xs-6"&gt;
                              &lt;a href="#" class="active" id="login-form-link"&gt;Login&lt;/a&gt;
                          &lt;/div&gt;
                          &lt;div class="col-xs-6"&gt;
                              &lt;a href="#" id="register-form-link"&gt;Register&lt;/a&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;hr&gt;
                  &lt;/div&gt;
                  &lt;div class="panel-body"&gt;
                      &lt;div class="row"&gt;
                          &lt;div class="col-lg-12"&gt;
                              {% block login_content %}
                              {% endblock %}
                              {% block register_content %}
                              {% endblock %}
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><code>login.html</code> which goes into the <code>{% block login_content %}</code></p>
  
  <pre><code>{% extends 'index.html' %}
  {% block login_content %}
  &lt;form id="login-form" action="{% url 'authentication:user_login' %}" role="form" style="display: block;" method="POST"&gt;
      {% csrf_token %}
      &lt;label for="username"&gt;Username:&lt;/label&gt;
      &lt;input id="username" type="text" name="username" placeholder="Enter Username" tabindex="1" class="form-control"&gt;
  
      &lt;label for="password"&gt;Password:&lt;/label&gt;
      &lt;input id="password" type="password" name="password" tabindex="=2" class="form-control" placeholder="Password"&gt;
  
      &lt;button type="submit" class="btn btn-success"&gt;Login&lt;/button&gt;
  
  &lt;/form&gt;
  {% endblock %}
  </code></pre>
  
  <p><code>register.html</code> that goes into the <code>{% block register_content %}</code></p>
  
  <pre><code>{% extends 'index.html' %}
  {% block register_content %}
      &lt;form id="register-form" role="form" style="display: none;" enctype="multipart/form-data" method="POST"&gt;
          {% csrf_token %}
          {{ user_form.as_p }}
          {{ profile_form.as_p }}
          &lt;input type="submit" name="" value="Register"&gt;
      &lt;/form&gt;
  {% endblock %}
  </code></pre>
  
  <p>On my UI, the <code>{{ user_form.as_p }}</code> and the <code>{{ profile_form.as_p }}</code> does not appear at all.</p>
  
  <p>When i inspect the console of my UI, the html does not even pick up the following line from the register.html:</p>
  
  <pre><code>&lt;form id="register-form" role="form" style="display: none;" enctype="multipart/form-data" method="POST"&gt;
  </code></pre>
  
  <p>Here is the <code>login.js</code> which is responsible for the UI interactivity:</p>
  
  <pre><code>$(function() {
  
      $('#login-form-link').click(function(e) {
          $("#login-form").delay(100).fadeIn(100);
          $("#register-form").fadeOut(100);
          $('#register-form-link').removeClass('active');
          $(this).addClass('active');
          e.preventDefault();
      });
      $('#register-form-link').click(function(e) {
          $("#register-form").delay(100).fadeIn(100);
          $("#login-form").fadeOut(100);
          $('#login-form-link').removeClass('active');
          $(this).addClass('active');
          e.preventDefault();
      });
  
  });
  </code></pre>
  
  <p>EDIT:
  Here is my <code>views.py</code>:</p>
  
  <pre><code>def user_login(request):
      if request.method == "POST":
          username = request.POST.get('username')
          password = request.POST.get('password')
  
          user = authenticate(username=username, password=password)
  
          if user:
              if user.is_active:
                  login(request, user)
                  return HttpResponseRedirect(reverse('homepage'))  # main page if login is successful
  
              else:
                  return HttpResponse("ACCOUNT NOT ACTIVE")
  
          else:
              print('Someone tried to log in and failed')
              print('Username: {}, password, {}'.format(username, password))
              return HttpResponse('Invalid login details supplied')
  
      else:
          return render(request, 'authentication/login.html', {})
  
  def register(request):
      registered = False
  
      if request.method == "POST":
          user_form = UserForm(data=request.POST)
          profile_form = UserProfileInfoForm(data=request.POST)
  
          if user_form.is_valid() and profile_form.is_valid():
  
              user = user_form.save()
              user.set_password(user.password)
              user.save()
  
              profile = profile_form.save(commit=False)
              profile.user = user
  
              if 'profile_pic' in request.FILES:
                  profile.profile_pic = request.FILES['profile_pic']
  
              profile.save()
  
              registered = True
  
          else:
              print(user_form.errors, profile_form.errors)
  
      else:
          user_form = UserForm()
          profile_form = UserProfileInfoForm()
  
      return render(request, 'authentication/register.html',
                    {
                        'user_form': user_form,
                        'profile_form': profile_form,
                        'registered': registered
                    })
  </code></pre>
  
  <p>Okay, it seems like it is impossible to have a single page display both the templates. Is there anyway to get it done?</p>