Web Form

Presentazione 2.3

Comunicazione integrata in rete| Prof. Luca A. Ludovico

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.

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)

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.

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 &.

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

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

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"

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

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);

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

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]

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>