CODEWITHSUNDEEP
cssdjango-crispy-forms
CL. L
CL. L

Reputation: 257

Django Crisy Form Layout Does Not Work

I am trying to use Django Crisy Form to build a contact form in a lightbox. However, I cannot get the layout or css working, as the result turns out the same in primitive html format. I attach the code below and appreciate that if anyone can suggest what to do to get it working. Thanks a lot.

Models.py:

from django.db import models

# Create your models here.
class db_contact(models.Model):
    Date = models.DateTimeField ('Date')
    Name = models.CharField ('Name', max_length = 50)
    Subject = models.DateField ('Subject', max_length = 20)
    Email = models.CharField ('Email', max_length = 200)
    Message = models.CharField ('Message', max_length = 50000)

    def __str__(self):
        return self.Subject

    class Meta:
        ordering = ['id']

Forms.py

from django import forms
from django.forms import ModelForm
from siteapps.models import db_contact
from crispy_forms.helper import FormHelper
from crispy_forms.layout import Layout, Fieldset, ButtonHolder, Submit

class frm_contact(ModelForm):       

    def __init__(self, *args, **kwargs):
        super(frm_contact, self).__init__(*args, **kwargs)
        self.helper = FormHelper(self)    
        self.helper.form_id = 'id-exampleForm'
        self.helper.form_class = 'blueForms'
        self.helper.form_method = 'post'
        self.helper.form_action = 'submit_survey'

        self.helper.add_input(Submit('submit', 'Submit'))


    class Meta:
        model = db_contact   
        fields = ['Name', 'Subject', 'Email', 'Message']

views.py

def contact(request):
    form_contact = frm_contact()
    return render(request, 'contact.html', {'form_contact' : form_contact})

contact.html

{% extends request.is_ajax|yesno:"fancybox/base.html,main.html" %}
{% load crispy_forms_tags %}
{% load i18n %}

{% block content %}

    {% crispy form_contact form_contact.helper %}

    <script src='https://www.google.com/recaptcha/api.js'></script>
    <div class="g-recaptcha" data-sitekey="xxx"></div>
{% endblock %}

Upvotes: 0

Views: 788

Answers (1)

CL. L
CL. L

Reputation: 257

I shall answer my questions as I found the solution.

It turns out I miss to put bootstrap js/css, and now it works with the bootstrap3.

More details of the answers can be found here: Django crispy forms not loading CSS

Upvotes: 1

Related Questions