Abarone.it Logo

Django - Creare modulo contatti

Form e Viste

In questo articolo, andiamo a progettare un form per il nostro sito web.
A meno di costruire un sito web che non prevede la visita di utenti dal web, una form è un requisito indispensabile.
Django mette a nostra disposizione una variegata gamma di strumenti e librerie per aiutarci a costruire le nostre form.
In particolare in questa lezione andremo a creare un form "contatti", attraverso il quale gli utenti potranno contattarci. Requisiti basilari sono quindi:
- Nome
- Cognome
- Email ( per poterci permettere di rispondere)
- Telefono (opzionale)
- Argomento per il quale ci contattano ( è prevista in questo caso una serie di opzioni, l'utente ne selezionerà soltanto una, ad esempio: commerciale, supporto ecc..)


Andiamo ora a vedere come funziona un form in HTML

In HTML, un form è un insieme di elementi all'interno <form>...</form> che permettono un visitatore di fare le cose come inserire il testo, selezionare le opzioni, manipolare gli oggetti o controlli, e così via, e quindi inviare le informazioni indietro al server.

Alcuni di questi elementi dell'interfaccia form - l'immissione di testo o caselle di controllo - sono abbastanza semplici e sono costruiti in HTML stesso. Altri sono molto più complessi; un'interfaccia che apre un selettore di dati o che consente di spostare un cursore o manipolare controlli tipicamente utilizza JavaScript e CSS, unito al form in HTML , ovvero utilizzando <input> che ci consente di visualizzare l'elemento per ottenere questi effetti.

Così come il suo elemento <input>, un modulo deve specificare due cose:

  1. dove: l'URL a cui i dati corrispondenti per l'input dell'utente devono essere inviati
  2. come: il metodo HTTP da utilizzare per inviare i dati

A titolo di esempio, il form di login per l'amministratore Django contiene diversi <input> elementi: uno di tipo = "text" per il nome utente, una di tipo = "password" per la password, e una di tipo = "submit" per il "Login" pulsante. Esso contiene anche alcuni campi di testo nascosti che l'utente non vede, che Django utilizza per determinare che cosa fare dopo.

Quando il <input type = "submit" value = "Log in ">, elemento viene attivato, i dati vengono restituiti a / admin / .


Metodi HTTP: GET e POST

GET e POST sono gli unici metodi HTTP da utilizzare quando si tratta di forme.

Modulo di login di Django viene restituito attraverso il metodo POST . Il browser quindi impacchetta i dati del modulo, li codifica per la trasmissione, li invia al server, e quindi riceve indietro la sua risposta.

GET , al contrario, compone i dati inseriti nel form all'interno di una stringa, e la utilizza per comporre un URL. L'URL contiene l'indirizzo in cui i dati devono essere inviati, così come le chiavi e valori dei dati. È possibile vedere in azione, se si fa una ricerca nella documentazione Django, che produrrà un URL della forma https://docs.djangoproject.com/search/?q=forms&release=1 .

GET e POST sono tipicamente utilizzati per scopi diversi.

Qualsiasi richiesta che potrebbe essere utilizzato per cambiare lo stato del sistema - per esempio, una richiesta che rende modifiche nel database - dovrebbe usare POST . GET deve essere utilizzato solo per le richieste che non influenzano lo stato del sistema.

GET non è adatto per creare form in cui andremo a inserire delle password, poiché la password apparirebbe nell'URL, e, quindi, apparirebbe anche nella cronologia del browser e del server visitato, e sarebbe visibile tutto in chiaro. Non è neanche adatto per grandi quantità di dati, o per dati binari, cosi come lo è un'immagine. Un'applicazione Web che utilizza GET come richieste di un modulo form di amministrazione è un rischio per la sicurezza: può essere facile per un utente malintenzionato imitare la richiesta di un modulo per ottenere l'accesso a parti sensibili del sistema. POST , in aggiunta con altre protezioni come quella di Django , ovvero la protezione CSRF, offre un maggiore controllo per l'accesso.

D'altra parte, GET è adatto per essere utilizzato come modulo di ricerca web, perché gli URL che rappresentano una richiesta tramite GET possono essere facilmente memorizzati come segnalibro, condivisi o inviati nuovamente.


Django e le forme

Costruire form è un compito quindi complesso. Considerate la form admin di Django, dove numerosi elementi di dati di diversi tipi possono avere bisogno di essere preparati per la visualizzazione nel form, restituito come pagina HTML, e modificati utilizzando un comoda interfaccia, quindi i dati devono arrivare al server, essere convalidati e ripuliti, e poi salvati o trasmessi per ulteriori elaborazioni.

La funzionalità dei moduli di Django può semplificare e automatizzare vaste porzioni di questo lavoro, e può anche farlo in modo più sicuro rispetto a quello che la maggior parte dei programmatori sarebbe in grado di fare con codice scritto da loro stessi.

Django gestisce tre parti distinte del lavoro che comporta form:

  • preparazione e ristrutturazione dei dati per renderlo pronto per il rendering
  • la creazione di form HTML per i dati
  • ricevere ed elaborare form presenti e dati dal client
    E ' possibile scrivere codice che fa tutto questo manualmente, ma Django può prendersi cura di tutto per voi.

Form con Django

Al centro di questo sistema di componenti è una modulo form di Django. Più o meno allo stesso modo in cui un modello di Django descrive la struttura logica di un oggetto, il suo comportamento, e il modo in cui le sue parti sono rappresentate per noi, un modulo di classe descrive un modulo e determina come funziona e appare.

Cosi come i campi di un modello mappano i campi del database, cosi i campi di un modulo form mappano un form in HTML <input> elementi. (A ModelForm associa i campi di una classe modello per form HTML <input> elementi attraverso un modulo , questo è ciò che l'amministratore Django si basa su.)

I campi di un modulo sono essi stessi classi; gestiscono dati del modulo e di eseguire la convalida quando viene inviato un modulo. Un DateField e un FileField gestire molto diversi tipi di dati e hanno a che fare cose diverse con esso.

Un campo modulo viene rappresentato a un utente nel browser come un "widget di" HTML - un pezzo di macchinario interfaccia utente. Ogni tipo di campo ha un adeguato predefinita classe Widget , ma questi può essere sostituito come richiesto.


Costruire un Form

Si supponga di voler creare un semplice modulo sul vostro sito web, al fine di ottenere il nome dell'utente. Avresti bisogno di qualcosa di simile nel modello:

  1. <Form action = "/ il tuo nome /" method = "post" >
  2. <label for = "your_name" > Your name: </label>
  3. <input id= "your_name" type= "text" name= "your_name" value= " {{ current_name }} " >
  4. <input type= "submit" value= "OK" >
  5. </form>

Questo dice al browser di restituire i dati del modulo all'URL / il tuo nome / , con il POST metodo. Verrà visualizzato un campo di testo, con l'etichetta "Il tuo nome:" e un pulsante "OK". Se il contesto modello contiene un current_name variabile, che verrà utilizzata per pre-riempire il your_name campo.

Avrete bisogno di una visione che rende il modello contenente il form HTML, e che può fornire il current_name campo a seconda dei casi.

Quando il modulo viene inviato, il POST richiesta che viene inviata al server conterrà i dati del modulo.

Ora avrete anche bisogno di una vista corrispondente a quella / il tuo nome / URL che troverà adeguati coppie chiave / valore nella richiesta, e poi elaborarli.

Questa è una forma molto semplice. In pratica, una forma può contenere decine o centinaia di campi, molti dei quali potrebbero aver bisogno di essere pre-popolato, e ci si potrebbe aspettare all'utente di lavorare attraverso il ciclo di modifica-presentare più volte prima di concludere l'operazione.

Potremmo richiedere qualche convalida che si verifichi nel browser, anche prima che il form venga inviato; si potrebbe desiderare di utilizzare i campi molto più complesso, che permettono all'utente di fare le cose come le date di prelievo da un calendario e così via.

A questo punto è molto più facile ottenere Django a fare la maggior parte di questo lavoro per noi.


File Forms.py

Il modulo di classe

Sappiamo già che cosa vogliamo che faccia il nostro Form. Il nostro punto di partenza per costruire il form attraverso Django è questo:

Creiamo all'interno della nostra app il file forms.py:

  1. from django import forms
  2. class NameForm ( forms.Form ):
  3. nome = forms.CharField( label = 'Il tuo nome' , MAX_LENGTH = 100 )

Questo definisce una classe form con un solo campo ( nome ). Abbiamo applicato un'etichetta human-friendly per il campo, che apparirà nel

La lunghezza massima consentita del campo è definito da max_length . Questo optional fa due cose. Si mette un maxlength = "100" sul HTML <input> (in modo che il browser dovrebbe impedire all'utente di immettere più di quel dato numero di caratteri, in primo luogo). Ma Significa anche che quando Django riceve indietro il form dal browser, Django convaliderà la lunghezza dei dati.

Un form istanziato ha anche una is_valid () metodo, che gestisce le routine di convalida per tutti i suoi campi. Quando viene chiamato questo metodo, se tutti i campi contengono dati validi, sarà:

  • ritornato un valore true
  • inserito il dato del modulo nel suo attributo cleaned_data corrispondente.

L'intero modulo, se renderizzato per la prima volta, sarà simile a:

  1. <Label for = "your_name" > Il tuo nome: </ label>
  2. <input id = "your_name" type = "text" name = "your_name" maxlength = "100" >

Si noti che non include i <form> tag, oppure un pulsante di invio. Dovremo fornire a coloro noi stessi nel modello.


La Views.py in Django

I dati della form inviati indietro ad un sito Web Django vengono elaborati da una View, in genere la stessa View che ha pubblicato il form. Questo ci permette di riutilizzarne la stessa logica.

Per gestire il modulo dobbiamo istanziare nella vista per l'URL in cui vogliamo che da pubblicare:

  1. views.py
  2. from django.shortcuts import render
  3. from django.http import HttpResponseRedirect
  4. from .forms import NameForm
  5. def get_name(request):
  6. # if this is a POST request we need to process the form data
  7. if request.method == 'POST':
  8. # create a form instance and populate it with data from the request:
  9. form = NameForm(request.POST)
  10. # check whether it's valid:
  11. if form.is_valid():
  12. # process the data in form.cleaned_data as required
  13. # ...
  14. # redirect to a new URL:
  15. return HttpResponseRedirect('/thanks/')
  16. # if a GET (or any other method) we'll create a blank form
  17. else:
  18. form = NameForm()
  19. return render(request, 'name.html', {'form': form})

Se arriviamo a questo punto della View, con una richiesta GET, si creerà un'istanza della form vuota e questa form verrà inserita nel contesto del template da renderizzare. Questo è ciò che ci si può aspettare che accada la prima volta che visiteremo la URL.

Se il modulo viene inviato tramite una richiesta POST, la View ancora caricherà una volta un'istanza della form e la compilerà con i dati della richiesta: modulo = NameForm (request.POST) Questo si chiama "dati vincolanti al modulo" (ora è un bound form).

Chiamiamo quindi il metodo is_valid () del form; se la risposta è false, torniamo al template con il form vuoto. Questa volta il modulo non è più vuota ( non legato ) in modo che il modulo HTML verranno popolati con i dati precedentemente presentati, dove può essere modificato e corretta come richiesto.

Se is_valid () è vero , saremo ora in grado di trovare tutti i dati del modulo convalidati nella sua cleaned_data attributo. Siamo in grado di utilizzare questi dati per aggiornare il database o eseguire altre lavorazioni prima di inviare un reindirizzamento HTTP al browser dicendogli dove andare.


Il Template

Non abbiamo bisogno di molto nella nostra pagina name.html:

  1. <form action="/your-name/" method="post">
  2. {% csrf_token %}
  3. {{ form }}
  4. <input type="submit" value="Submit" />
  5. </form>

Tutti i campi del form saranno spacchettati nella pagina HTML dal linguaggio del template di Django.

HTML5

Se il nostro form utilizza un EmailFiel, un UrlFiel o un campo integer, allora Django reinderizzera il nostro Form attraverso campi in HTML5.

CRSF

Se abilitiamo il csrf nel nostro form attraverso il metodo POST, allora nel template dovremmo utiizzare crsf_token come nell'esempio sopra


barone.antonio@libero.it