Jak stylovat formuláře s django-crispy-formy

Nejlepší způsob, jak ovládnout Django, je použít jej k vývoji full-stack aplikací. Při práci s frameworkem narazíte na mnoho fascinujících funkcí. Jedním z nich je způsob vykreslování formulářů v šablonách pomocí křupavých formulářů.

Použití django-crispy-forms je jedním z mnoha způsobů, jak můžete vykreslit formuláře v Django. Závislost umožňuje vytvářet formuláře v šablonách bez psaní HTML kódu. Můžete snadno vytvářet opakovaně použitelná rozvržení, aniž byste se museli obtěžovat psaním kódu formuláře.

Více se můžete dozvědět tak, že si knihovnu nainstalujete, poté ji nakonfigurujete a použijete k vytvoření registračního formuláře.

Jak funguje django-crispy-forms

The knihovna django-crispy-forms přichází s vestavěným HTML kódem, který si můžete upravit podle svých potřeb. Obsahuje filtr s názvem |křupavé který vykresluje formuláře založené na div v šabloně.

The {% křupavý %} tags bude vykreslovat formuláře podle konkrétního nastavení. django-crispy-forms funguje dobře s dalšími závislostmi šablon, jako je Bootstrap a Tailwind CSS.

Podívejme se, jak to funguje v šabloně.

Nainstalujte Crispy Forms

Začněte tím vytvoření projektu Django a aplikace Poté nainstalujte nejnovější verzi django-crispy-forms pomocí Pipenv s následujícím příkazem:

pipenv Nainstalujte django-crispy-forms

Úspěšná instalace bude vypadat jako na obrázku níže:

Nakonfigurujte django-crispy-forms v Nastavení

Po instalaci musíte zaregistrovat křupavé formuláře jako závislost v nastavení projektu. Po registraci bude knihovna křupavých formulářů dostupná všem aplikacím v projektu.

V projektu settings.py soubor, přidejte řetězec 'crispy_forms':

INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.zprávy',
'django.contrib.staticfiles',
'moje aplikace',
'crispy_forms',
]

Vytvořte formulář

Chcete-li pomoci s ověřováním, musíte svůj registrační formulář synchronizovat s vestavěným formulářem pro vytvoření uživatele Django.

Vestavěný Ověření uživatele Django systém zpracovává běžné požadavky, jako je ověřování hesel a vydávání oprávnění.

Systém za vás také vyřídí ověření formuláře. Můžete tak vytvářet formuláře, aniž byste se museli sami zabývat ověřováním. Pokud jste provedli ověření formuláře v jiných rámcích, budete vědět, jak těžkopádné to může být. Ne s Djangem.

Autentizační modul má a Uživatel model nebo objekt. The Uživatel objekt je hlavní součástí systému autentizace uživatele. Zpracovává oprávnění, ověřuje profily registrovaných uživatelů, řídí přístup a mnoho dalšího.

The UserCreationForm používá vestavěný Uživatel protestovat proti registraci nových uživatelů. Dědí z třídy ModelForm.

Nejprve importujte formuláře z modulu formulářů Django. Poté importujte UserCreationForm z django.contrib.auth.forms. Také importujte vestavěné Uživatel model od django.contrib.auth.modely. Poté importujte vstupy polí z django ModelForm.

z django import formuláře
zdjango.přispívat.auth.formulářeimportUserCreationForm
zdjango.přispívat.auth.modelyimportUživatel
z django.forms import ModelForm, TextInput, EmailInput, ImageField, Textarea

Dále vytvořte registrační objekt s názvem RegisterUserForm. To trvá UserCreationForm jako argument. Přidat Uživatel pole objektů, jako je ověření e-mailu, uživatelské jméno a dvě hesla.

třídaRegisterUserForm(UserCreationForm):
 email = formuláře. EmailField (max_length=254, help_text='Požadované. Zadejte platnou e-mailovou adresu.')
třídaMeta:
 model = Uživatel
 pole = ('uživatelské jméno', 'e-mailem', 'heslo 1', 'heslo 2')

Tato pole jsou primárními atributy uživatele v registračním formuláři. Jsou to povinné vstupy, které musí uživatelé vyplnit, aby je systém autentizoval.

Vytvořte funkci zobrazení

Dále vytvoříte funkci zobrazení pro registrační formulář. Nejprve importujte funkci renderování a také RegisterUserForm z formulářů.py. Poté importujte Uživatel model od django.contrib.auth.modely.

Funkce zobrazení s názvem register přebírá RegisterUserForm. Vykreslí to na register.html šablona.

z django.zkratky import poskytnout,
z django.http import HttpResponse, HTTP404
z .formuláře import RegisterUserForm
zdjango.přispívat.auth.modelyimportUživatel
defRegistrovat(žádost):
 form=RegisterUserForm
 kontext={'formulář':formulář}
 vrátit render (žádost,'register.html',kontext)

Vytvořit cestu URL

Vytvořte cestu URL pro register.html šablona. Tato adresa URL je cesta k funkci zobrazení, kterou jste právě vytvořili. Dejte tomu jméno Registrovat, takže jej můžete použít k volání na šabloně.

z django.urls import cesta
z. import pohledy
urlpatterns=[
 cesta ('Registrovat', views.register, name='Registrovat'),
]

Načíst šablonu

Nyní, když máte zobrazení a cestu URL, můžete vytvořit soubor register.html šablonu ve složce aplikace. K vykreslení použijete django-crispy-forms RegisterUserForm.

V register.html šablonu, rozšířit základna.html. The základna.html obsahuje Bootstrap odkazy použijete ke stylizaci registračního formuláře. Poté načtěte django-crispy-forms s register.html pomocí šablon šablon.

{% rozšiřuje 'základna.html' %}
{% load crispy_forms_tags %}
{% block content %}
<třída div="kontejner" styl="">
<třída div="řádek">
<třída div="col-md-2"></div>
<třída div="col-md-8">
<třída div="Kartu" styl="Černá barva;">
<třída div="tělo karty">
<třída h5="název karty"><A>Zaregistrujte se jako člen</A><styl rozpětí="plovák: vpravo">Jste členem? <a href="#" třída="text-primární">Přihlas se nyní</A></span></h5>
<třída div="text karty">
<forma akce="" metoda ="POŠTA" novalidovat>
 {% csrf_token %}
 {{form|křupavé}}
<typ tlačítka ="Předložit" třída="btn btn-primární btn-sm"> Registrovat</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% endblock %}

Formulář obsahuje csrf_token, která chrání proces registrace před hackery. Vykreslete formulář se stejným názvem proměnné jako ve funkci zobrazení. Poté přidejte |křupavý filtr na Django {{formulář}} variabilní. Tím se forma vykreslí jako křupavá.

Spusťte server. Poté zkontrolujte aplikaci v prohlížeči na adrese http://127.0.0.1:8000/register. Měli byste vidět formulář zobrazený na obrázku níže:

Vytvořili jste registrační formulář pomocí křupavých formulářů! Všimněte si, že Django automaticky přidal ověření do formuláře. Patří mezi ně požadavky, jako jsou oprávnění k uživatelskému jménu a heslu.

Chcete-li mít kompletní systém registrace, přidejte do funkce zobrazení logiku ověřování. Můžete také přidat přihlašovací stránku pro přihlášení registrovaných uživatelů. Uživatelé by měli splňovat požadavky na ověření, aby se mohli přihlásit do aplikace.

Knihovna django-crispy-forms vám umožní rychle a snadno vykreslit ověřené formuláře. Ověřování dat zajišťuje, že máte od svých uživatelů přesná data.

Data se hodí při komunikaci s uživateli a analýze metrik výkonu.

Proč používat django-crispy-formy?

Použití křupavé knihovny formulářů k vykreslování formulářů v Django je skvělým příkladem, jak aplikovat princip DRY. django-crispy-forms vytváří opakovaně použitelné komponenty, které můžete vykreslit v šablonách.

Dodávají se s vestavěným HTML kódem. Kód vám ušetří starosti se strukturováním a ověřováním formulářů. Křupavé formuláře poskytují značku a filtr, které vykreslují formuláře ve formátu div. Poskytují také možnost konfigurovat a ovládat vykreslovaný HTML.

django-crispy-forms funguje dobře s autentizačním systémem Django. Můžete vytvořit autentizační systém pro ověření vašich uživatelů, aniž byste museli psát mnoho kódu.