Django forms does not display the form fields when using {% include%}

0

I have been trying for several days to find the answer to this problem. I have tried with the solutions suggested in the threads that I found in which other users had something similar, but none has worked so far.

I created a contact form following the tutorial and it works perfectly if I open the URL where the form's html is; however, when trying to include it in index using {% include%}, the submit button and style appear, but none of the form fields.

This is what I have in my code:

views.py

from django.http import HttpResponse
from django.views import generic
from django.views.generic.edit import CreateView, UpdateView, DeleteView
from django.core.mail import send_mail
from .forms import ContactForm
from django.shortcuts import render

# Create your views here.
def index(request):
    return render(request, 'landingpage/index.html', {})

#Contact form
def contact(request):
    if request.method == 'POST':
        form = ContactForm(request.POST)
        if form.is_valid():
            name = request.POST.get ('name')
            email = request.POST.get ('email')
            message = request.POST.get ('message')

            send_mail('Subject here', content, contact_email, [‘[email protected]'], fail_silently=False)
            return HttpResponseRedirect('/thanks/')
    else:
        form = ContactForm()
    return render(request, 'landingpage/contact.html', {'form': form})

#Thank you message
def thanks (request):
    return render(request, 'landingpage/thanks.html', {})

urls.py

app_name = 'landingpage'
urlpatterns = [
    # Landingpage urls
    url(r'^$', views.index, name='landing-index'),
    url(r'^contact/$', views.contact, name='contact'),
    url(r'^thanks/$', views.thanks, name='thanks'),
]

index.html

{% block form %}

        {% include 'landingpage/contact.html' with form=form %}

{% endblock form %}

contact.html

{% block form %}
<section id="contact">
      <div class="container">
        <div class="row">
          <div class="col-lg-12 text-center">
            <h2 class="section-heading text-uppercase">Contact Us</h2>
          </div>
        </div>
        <div class="row">
          <div class="col-lg-12">
            {% if form.errors %}
                <p style="color: red;">
                    Please correct the error{{ form.errors|pluralize }} below.
                </p>
               {% endif %}
            <form id="contactForm" name="sentMessage" action="" method="post" novalidate>
              {% csrf_token %}

                {% for hidden_field in form.hidden_fields %}
                  {{ hidden_field }}
                {% endfor %}

                {% if form.non_field_errors %}
                  <div class="alert alert-danger" role="alert">
                    {% for error in form.non_field_errors %}
                      {{ error }}
                    {% endfor %}
                  </div>
                {% endif %}

                {% for field in form.visible_fields %}
                  <div class="form-group">
                    {{ field.label_tag }}

                    {% if form.is_bound %}
                      {% if field.errors %}
                        {% render_field field class="form-control is-invalid" %}
                        {% for error in field.errors %}
                          <div class="invalid-feedback">
                            {{ error }}
                          </div>
                        {% endfor %}
                      {% else %}
                        {% render_field field class="form-control is-valid" %}
                      {% endif %}
                    {% else %}
                      {% render_field field class="form-control" %}
                    {% endif %}

                    {% if field.help_text %}
                      <small class="form-text text-muted">{{ field.help_text }}</small>
                    {% endif %}
                  </div>
                {% endfor %}

                <div class="clearfix"></div>
                <div class="col-lg-12 text-center">
                  <div id="success"></div>
                  <button id="sendMessageButton" class="btn btn-primary btn-xl text-uppercase" type="submit">Send Message</button>
                </div>
              </div>
            </form>
          </div>
        </div>
      </div>
</section>
{% endblock form%}
    
asked by Lolita66 25.02.2018 в 12:18
source

1 answer

1

It is already solved, I leave here the answer in case it serves as something to someone in the future. The problem was that I did not mention the form variable in index in views. It should be:

views.py

def index(request):
     ctx = {
       'form':  ContactForm()
     }
     return render(request, 'landingpage/index.html', ctx)
    
answered by 25.02.2018 / 20:46
source