Skip to main content

Coral formsets

Project description

coral-formsets

Extensão para manipular o frontend usando Django FormSets.

Não tem dependência com outro framework/biblioteca javascript.

Documentation

Installation

Para instalar coral-formsets:

pip install coral-formsets

Adicione coral_formsets em INSTALLED_APPS:

INSTALLED_APPS = [
    # other apps
    "coral_formsets",
]

Usage

No seu html adicione o js como no exemplo abaixo.
Nesse exeplo yourapp/form.html é um arquivo referente ao template do seu form, isso garante mais clareza ao seu código:

<!-- yourapp/form.html -->
<div data-form>
  <div style="display: none">{{ form.DELETE }}{{ form.id }}</div>
  {{ form.as_p }}
  <button data-delete>
    delete form
  </button>
</div>
<!-- yourapp/view.html -->
{% load static coral_formset_tags %}
<!DOCTYPE html>
<html>
<body>
  <div data-formset>
    {% render_empty_form_template 'yourapp/form.html' formset as empty_form %}

    {{ formset.management_form }}

    <div data-body>
      {% for form in formset %}
        {% include 'yourapp/form.html' with form=form %}
      {% endfor %}
    </div>

    <button class="formset"
            data-empty-form="{{ empty_form }}"
            data-prefix="{{ formset.prefix }}">
      Add form
    </button>
  </div>

  <script src="{% static 'coral_formsets/js/FormSet.js' %}"></script>
  <script>
    document.querySelectorAll('.formset').forEach(el => {
      new window.coral.FormSet(el);
    });
  </script>
</body>
</html>

A templatetag render_empty_form_template irá transformar o seu formset.empty_form em texto, para depois fazer a inserção do novo form via javascript.

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

coral-formsets-0.1.2.tar.gz (17.1 kB view hashes)

Uploaded Source

Built Distribution

coral_formsets-0.1.2-py3-none-any.whl (17.3 kB view hashes)

Uploaded Python 3

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page