![Page 1: Web Form Presentazione 2.3 Comunicazione integrata in rete| Prof. Luca A. Ludovico](https://reader036.vdocuments.pub/reader036/viewer/2022062702/5542eb72497959361e8d9471/html5/thumbnails/1.jpg)
Web Form
Presentazione 2.3
Comunicazione integrata in rete| Prof. Luca A. Ludovico
![Page 2: Web Form Presentazione 2.3 Comunicazione integrata in rete| Prof. Luca A. Ludovico](https://reader036.vdocuments.pub/reader036/viewer/2022062702/5542eb72497959361e8d9471/html5/thumbnails/2.jpg)
Comunicazione integrata in rete Prof. Luca A. Ludovico
Introduzione
• I moduli (form) si utilizzano tipicamente per raccogliere informazioni dall’utente finale.
• Un form può contenere campi di testo, caselle di scelta, radio button, check box ecc.
• L’implementazione di un form contempla 3 passi: progettare l’interfaccia utente, implementare il processing lato server e configurare tali due oggetti per comunicare tra loro.In questa lezione si vedrà come i dati provenienti dai form possano essere processati da parte del server.
![Page 3: Web Form Presentazione 2.3 Comunicazione integrata in rete| Prof. Luca A. Ludovico](https://reader036.vdocuments.pub/reader036/viewer/2022062702/5542eb72497959361e8d9471/html5/thumbnails/3.jpg)
Comunicazione integrata in rete Prof. Luca A. Ludovico
Passaggio di valori al server
• Ogni form può (deve?) passare valori a una pagina sul server che li raccoglie per salvarli/usarli/elaborarli
• Il tag form presenta due attributi fondamentali: a chi inviare i dati e come inviarli– action="nome_pagina" – method="nome_metodo" (get o post)
![Page 4: Web Form Presentazione 2.3 Comunicazione integrata in rete| Prof. Luca A. Ludovico](https://reader036.vdocuments.pub/reader036/viewer/2022062702/5542eb72497959361e8d9471/html5/thumbnails/4.jpg)
Comunicazione integrata in rete Prof. Luca A. Ludovico
GET e POST
• Attraverso l’attributo method="nome_metodo", il form stabilisce come inviare i dati alla pagina destinatario. Nome_metodo può valere get o post.
• Il metodo GET consiste nell’accodare i dati all’indirizzo della pagina richiesta, facendo seguire il nome della pagina da un punto interrogativo e dalle coppie nome/valore separate da &.
• Se il metodo è POST, i dati vengono invece inviati in maniera da non essere direttamente visibili per l’utente, attraverso la richiesta HTTP che il browser invia al server.
![Page 5: Web Form Presentazione 2.3 Comunicazione integrata in rete| Prof. Luca A. Ludovico](https://reader036.vdocuments.pub/reader036/viewer/2022062702/5542eb72497959361e8d9471/html5/thumbnails/5.jpg)
Comunicazione integrata in rete Prof. Luca A. Ludovico
Nome dei controlli
• Ogni controllo può essere associato a un nome (attributo name). Quando avviene il passaggio di valori al server, tipicamente alla pressione del pulsante Submit, vengono passate tante coppie
nome=valorequanti sono gli input presenti nel form.Per quanto riguarda il valore, si veda la slide seguente.
• Se method="get", il browser mostra tali coppie nella barra degli indirizzi, dopo il carattere ? e separate tra loro dal carattere &.
![Page 6: Web Form Presentazione 2.3 Comunicazione integrata in rete| Prof. Luca A. Ludovico](https://reader036.vdocuments.pub/reader036/viewer/2022062702/5542eb72497959361e8d9471/html5/thumbnails/6.jpg)
Comunicazione integrata in rete Prof. Luca A. Ludovico
Passaggio dei valori
• In generale, il valore assunto dal controllo è la compilazione effettuata dall’utente. – Ad esempio per le aree di testo e le caselle di testo
• Alcuni controlli presentano solo valore vero/falso, come le caselle di controllo.
• Alcuni controlli consentono la scelta tra valori. In questo caso, ad ogni opzione va associato esplicitamente un valore diverso tramite value="valore".
– Ad esempio per i pulsanti di scelta e i menu a discesa
![Page 7: Web Form Presentazione 2.3 Comunicazione integrata in rete| Prof. Luca A. Ludovico](https://reader036.vdocuments.pub/reader036/viewer/2022062702/5542eb72497959361e8d9471/html5/thumbnails/7.jpg)
Comunicazione integrata in rete Prof. Luca A. Ludovico
Passaggio dei valori
• Chi passa i valori e chi li riceve?
• Come vengono passati i valori?Dipende:– Metodo GET– Metodo POST
• La pagina destinataria riceve l’array associativo $_GET o $_POST a seconda del metodo di passaggio dei valori da parte del form
• Per comodità, nel seguito si utilizzerà $_GET
![Page 8: Web Form Presentazione 2.3 Comunicazione integrata in rete| Prof. Luca A. Ludovico](https://reader036.vdocuments.pub/reader036/viewer/2022062702/5542eb72497959361e8d9471/html5/thumbnails/8.jpg)
Comunicazione integrata in rete Prof. Luca A. Ludovico
Recupero dei valori
• Ipotizziamo di avere il link http://.../setcolor.php?color=greencorrispondente a un ipotetico passaggio di valori con il metodo get
• Nella pagina setcolor.php, l’array $_GET avrà un campo color il cui valore è "green"
• In PHP, è possibile dunque scrivere<?php
$mio_colore = $_GET["color"];?>e $mio_colore sarà inizializzato a "green"
![Page 9: Web Form Presentazione 2.3 Comunicazione integrata in rete| Prof. Luca A. Ludovico](https://reader036.vdocuments.pub/reader036/viewer/2022062702/5542eb72497959361e8d9471/html5/thumbnails/9.jpg)
Comunicazione integrata in rete Prof. Luca A. Ludovico
Altro esempio
<form action="raccogli_risultati.php" method="get"> Nome: <input name="nome_utente" type="text"> Cognome: <input name="cognome_utente" type="text"> <input type="submit" value="Invia"></form>
Indirizzo: raccogli_risultati.php?nome_utente=Luca&cognome_utente=Ludovico
Questo genera un array associativo $_GET con 2 celle:•Prima cella: indice = nome_utente; valore = Luca•Seconda cella: indice = cognome_utente; valore = Ludovico
![Page 10: Web Form Presentazione 2.3 Comunicazione integrata in rete| Prof. Luca A. Ludovico](https://reader036.vdocuments.pub/reader036/viewer/2022062702/5542eb72497959361e8d9471/html5/thumbnails/10.jpg)
Comunicazione integrata in rete Prof. Luca A. Ludovico
Approfondimento
• E’ sempre necessario avere un form per passare valori?
• No: ad esempio, un link può essere formattato all’interno del tag <a> o direttamente nella barra degli indirizzi secondo la regola
• In tal caso, la pagina linkata disporrà di un array $_GET contenente tutti i campi scritti nel link.
• Prova: usare il comando PHPvar_dump($_GET);
![Page 11: Web Form Presentazione 2.3 Comunicazione integrata in rete| Prof. Luca A. Ludovico](https://reader036.vdocuments.pub/reader036/viewer/2022062702/5542eb72497959361e8d9471/html5/thumbnails/11.jpg)
Comunicazione integrata in rete Prof. Luca A. Ludovico
Esempio
• Codice sorgente di esempio1.php:
<?phpvar_dump($_GET);
?>
• Chiamate:
http://.../esempio1.php
http://.../esempio1.php?color=green
http://.../esempio1.php?date=2014-04-07&language=ITA&course=ifts
![Page 12: Web Form Presentazione 2.3 Comunicazione integrata in rete| Prof. Luca A. Ludovico](https://reader036.vdocuments.pub/reader036/viewer/2022062702/5542eb72497959361e8d9471/html5/thumbnails/12.jpg)
Comunicazione integrata in rete Prof. Luca A. Ludovico
Esercizio
• Si scriva un form che chieda all’utente – il nome di battesimo (casella di testo)– il sesso (pulsante di scelta)– l’eventuale presenza di figli (casella di controllo)
• Si scriva una pagina PHP che raccolga i dati e li utilizzi nel seguente modo:– «Ciao, [nome utente].»– «Sei stato/a selezionato/a per la nostra promozione»
[sulla base del pulsante di scelta selezionato]– «Dalla tua scheda, risulta che hai/non hai figli» [sulla
base del check sulla casella di controllo]
![Page 13: Web Form Presentazione 2.3 Comunicazione integrata in rete| Prof. Luca A. Ludovico](https://reader036.vdocuments.pub/reader036/viewer/2022062702/5542eb72497959361e8d9471/html5/thumbnails/13.jpg)
Comunicazione integrata in rete Prof. Luca A. Ludovico
Una possibile soluzione (pagina target)
<?php $nome = $_GET["username"]; if ($_GET["sex"] == "M") $finale = "o"; else $finale = "a";?>
<!doctype html>…<body> <h1>Ciao, <?php echo $nome; ?>.</h1> <p>Sei stat<?php echo $finale; ?> selezionat<?php echo $finale; ?> per la nostra promozione!</p> <p>Dalla tua scheda, risulta che <?php if ($_GET["sons"] != "on") echo "non"; ?> hai figli.</p></body></html>