Forms sample - Viewflow Demo

Signup form

Username

First name

Last name

Emails

Email	Description
Email	Description
Email	Description

Addresses

        
        Line 1
        
        Line 2
        
        State
        
        City
        
        Zipcode
        
        Line 1
        
        Line 2
        
        State
        
        City
        
        Zipcode
        
        Line 1
        
        Line 2
        
        State
        
        City
        
        Zipcode

Source code
Python
HTML

Signup form

from django import forms 
from django.forms import formset_factory 
from material import Layout, Row, Stacked 
from material.forms import Form, FormSetField 

class EmailForm(forms.Form):
    email = forms.EmailField()
    description = forms.CharField()

EmailFormSet = formset_factory(EmailForm, extra=3, can_delete=True) 

class AddressForm(forms.Form):
    line_1 = forms.CharField(max_length=250)
    line_2 = forms.CharField(max_length=250)
    state = forms.CharField(max_length=100)
    city = forms.CharField(max_length=100)
    zipcode = forms.CharField(max_length=10)

    layout = Layout(
        'line_1',
        'line_2',
        'state',
        Row('city', 'zipcode'),
    )

AddressFormSet = formset_factory(AddressForm, extra=3, can_delete=True) 

class SignupForm(Form):
    username = forms.CharField(max_length=50)
    first_name = forms.CharField(max_length=250)
    last_name = forms.CharField(max_length=250)
    emails = FormSetField(formset_class=EmailFormSet)
    addresses = FormSetField(formset_class=AddressFormSet)

    layout = Layout(
        'username',
        Row('first_name', 'last_name'),
        'emails',
        Stacked(1, 'addresses'),
    )

Signup form

<form method="POST">
    {% csrf_token %}    
    {% form %}
    {% endform %}
    <button type="submit" class="btn">Submit</button>
</form>

Emails

Addresses

Source code

Signup form

Signup form