Coveraver
Coveraver

Reputation: 159

How to display django form in modal window?

I saw this post, but it did not help me

In the modal window, the form is not displayed.

View:

class CreateOrder(FormView):
    template_name = 'toner/add_order.html'

    form_class = OrderForm
    success_url = '/toner/'

    def form_valid(self, form):
        form.save()
        return super(CreateOrder, self).form_valid(form)

add_order.html:

<div id="order" class="modal fade" role="dialog">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-body">
            <div class="container txt-box">
                <form action="{% url 'add_order' %}" role="form" method="post">
                    {% csrf_token %}
                    {{ form.media }}
                    {{ form.address }}
                    {{ form.room }}
                    {{ form.count }}
                    <button class="btn btn-success" type="submit">
                        Done
                    </button>
                </form>
            </div>
        </div>
    </div>
</div>

main_page.html:

{% extends 'toner/base.html' %}

{% block main_page %}

....

<div>
    <button class="btn btn-primary" data-toggle="modal" data-
    target="#order">
        Order
    </button>
    {% include "toner/add_order.html" %}
</div>
{% endblock %}

urls:

url(r'add_order/$', CreateOrder.as_view(), name='add_order'),

If I go directly to the url (/add_order) it works. I can see the form. But from main_page.html the modal window is empty. Maybe someone has solved for themselves such a task?

UPDATE

from django.views.generic import ListView, FormView
from .models import Printer, Order
from .forms import OrderForm


class MainPageView(ListView):
    template_name = 'toner/main_page.html'

    model = Printer

    def get_context_data(self, **kwargs):
        context = super(MainPageView, self).get_context_data(**kwargs)
        context['printer'] = Printer.objects.all()
        context['order'] = Order.objects.all()
        return context


class CreateOrder(FormView):
    template_name = 'toner/add_order.html'

    form_class = OrderForm
    success_url = '/toner/'

    def form_valid(self, form):
        form.save()
        return super(CreateOrder, self).form_valid(form)

Upvotes: 5

Views: 16165

Answers (1)

Mauricio Cortazar
Mauricio Cortazar

Reputation: 4213

It doesn't work because you aren't passing the form in the view. You have to this with the view of main_page.html.

Because you are calling the main_page.html view not the CreateOrder view that's why Django can render your form. If you post your main view I can help you.

I am not sure about class based views but should be something like:

class MainPageView(ListView, FormView):
    template_name = 'toner/main_page.html'

    model = Printer

    form_class = OrderForm
    success_url = '/toner/'

    def form_valid(self, form):
        form.save()
        return super(MainPageView, self).form_valid(form)

    def get_context_data(self, **kwargs):
        context = super(MainPageView, self).get_context_data(**kwargs)
        context['printer'] = Printer.objects.all()
        context['order'] = Order.objects.all()
        return context

Upvotes: 8

Related Questions