Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
A jQuery plugin to allow users to dynamically add and remove formset elements in Django
branch: master

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.
README.md Added readme
django-formsets.jquery.js Intitial Commit

README.md

Django's admin allows you to dynamically add and remove formset forms. This jQuery plugin does the same for the front end.

Markup

Each form is rendered using django-uni-form. I've wrapped each form in an additional div.form. This makes it a lot easier to target each entire form.

<div class="formset-group" id="phone_formset">
    <h2>Phones</h2>
    {% for phone_form in phone_formset.forms %}
        <div class="form">
            {{ phone_form|as_uni_form }}
        </div>
    {% endfor %}
</div>

Initialisation

Simply copy the plugin to your scripts directory and link it up into your page. Then initialise the plugin as detailed below. All parameters are required at the moment.

<script type="text/javascript" charset="utf-8" src="{{ MEDIA_URL }}scripts/formsets.jquery.js"></script>
<script type="text/javascript" charset="utf-8">
    $(document).ready(function(){
        $('#phone_formset').formset({
            'prefix': 'phone_set',
            'addCssClass': 'add-link',
            'addText': 'Add',
            'removeCssClass': 'remove-link',
            'removeText': 'Remove'
        });
    });
</script>

Status

I've not used this in production yet but it seems fairly robust in my testing. Please log bugs/enhancements as you find them.

Something went wrong with that request. Please try again.