Esempio Progetto PHP Un piccolo negozio online CORSO: Master di primo livello in tecnologie sicurezza web e networking Docente: Dott.ssa Daniela Remogna www.fimietta.it 1
Presentazione del progetto L azienda InfoTech è un piccolo negozio di informatica che tratta le seguenti categorie di articoli: CHIAVETTE HARD DISK RAM SCHEDE VIDEO PORTATILI ROUTER InfoTech decide di ingrandire la propria attività vendendo i propri prodotti sulla rete di Internet. Infotech ha bisogno di un sito Internet che le consenta di presentare i propri prodotti sul web. Inoltre anche i dipendenti dell azienda con basse competenze informatiche, devono aver la possibilità di inserire nuovi prodotti in modo semplice e veloce. 2
Presentazione del progetto Come progettare tutto questo? Prima di tutto bisogna pensare a come strutturare le pagine del sito. Quante sono? Cosa fanno? In linea generale dovranno esserci due categorie di pagine: La prima categoria è quella del front-end e qui troviamo le pagine visibili a tutti gli utenti, ad esempio la pagina catalogo prodotti. La seconda categoria è quella del back-end e qui troviamo le pagine di amministrazione del sito web, come ad esempio la pagina inserisci un nuovo prodotto. Le pagine del back-end dovrebbero essere protette con autenticazione. In questo modo solo il personale dell azienda InfoTech potrà inserire dei nuovi prodotti e non il resto del mondo di internet. La fase di autenticazione non sarà illustrata in questo progetto. Per ora ci accontentiamo di creare la struttura e le pagine senza protezione. 3
Struttura delle pagine FRONT-END: index.php prodotti.php GUIDE UTILI http://php.html.it/guide/ BACK-END: admin.php nuova_categoria.php nuovo_prodotto.php inserisci_prodotto.php inserisci_categoria.php RACCOLTA SCRIPT UTILI http://php.html.it/script/ 4
L HOME PAGE la pagina index.php FRONT-END: index.php E la pagina di presentazione del sito. La parte più importante è il link CONSULTA IL CATALOGO che consente di sfogliare per categoria i prodotti registrati nel DATABASE. 5
LA PAGINA prodotti.php FRONT-END: prodotti.php E il catalogo prodotti del sito. Cosa fa questa pagina? In poche parole, legge il contenuto di due tabelle presenti nel database e impagina i risultati utilizzando l HTML e i CSS. La prima tabella ad essere letta è CATEGORIE. Mentre la seconda tabella è PRODOTTI. 6
LA SEZIONE AMMINISTRATIVA BACK-END: admin.php Questa sezione è quella che utilizzeranno i dipendenti dell azienda InfoTech per aggiungere in modo semplice e veloce nuovi prodotti. La parte più importante di questa pagina è il menu composto dalle voci NUOVO PRODOTTO, NUOVA CATEGORIA, HOME PAGE. 7
INSERIMENTO DI UN NUOVO PRODOTTO BACK-END: nuovo_prodotto.php Cosa fa questa pagina? Consente di registrare un nuovo prodotto nel database. La parte più importante è il FORM / MODULO che consente di raccogliere i dati inseriti dal personale dell InfoTech all interno di apposite caselle di testo/textarea e menu a tendina. Notare che il menu a tendina della Categoria viene compilato dinamicamente leggendo il contenuto della tabella Categorie. Il form spedisce i dati alla pagina inserisci_prodotto.php 8
LA PAGINA inserisci_prodotto.php BACK-END: inserisci_prodotto.php Cosa fa questa pagina? Raccoglie i dati digitati dal personale dell InfoTech nella pagina nuovo_prodotto.php e li salva nel database all interno della tabella PRODOTTI. 9
LA PAGINA nuova_categoria.php BACK-END: nuova_categoria.php Cosa fa questa pagina? Consente di registrare una nuova categoria di prodotti. La parte più importante è il FORM / MODULO che consente di raccogliere i dati inseriti dal personale dell InfoTech all interno delle caselle di testo. E importante che ogni elemento del form abbia un nome univoco (attributo name del tag apposito) 10
LA PAGINA prodotti.php BACK-END: inserisci_categoria.php Cosa fa questa pagina? Raccoglie i dati digitati dal personale dell InfoTech nella pagina nuova_categoria.php e li salva nel database all interno della tabella CATEGORIE. 11
Flusso pagine per l inserimento di un nuovo prodotto 1 index.php 2 admin.php 3 nuovo_prodotto.php 4 inserisci_prodotto.php 12
Progettazione DATABASE Per ogni articolo trattato si desidera visualizzare le seguenti informazioni: IDARTICOLO NOME CATEGORIA DESCRIZIONE QTA PREZZO FOTO 1 CHIAVE USB 1 GB KINGSTON CHIAVETTE Questo modello risponde alle esigenze degli utenti home office, delle piccole aziende e di scuole 20 6.00 KIN_MH_51796_DTI_1GB_C.jpg 2 CHIAVETTA USB BRACCIALE 1GB NERO CHIAVETTE La particolarità di questa pen drive è costituita dal fatto che la puoi facilmente indossare come un braccialetto in modo da avere sempre con te i tuoi dati, le tue foto e la tua musica! 50 15.00 NEO_MH_55930_PD2104K_2_C.jpg 3 SAMSUNG HARD DISK 80GB 2.5 IDE HARD DISK Una grande capacità di archiviazione associata ad un funzionamento silenzioso ed affidabile 8 50.00 SHD_MM_63058_HM080HC.jpg 4 HARD DISK 1 THERA SATA2 GREEN POWER HARD DISK La prima famiglia di hard disk attenti ai consumi! 10 200.00 WDG_MM_58362_WD10EACS.jpg 13
TECNOLOGIE E necessario creare e progettare un database dove memorizzare i dati dei prodotti trattati. E necessario progettare pagine dinamiche che permettano di inserire nuovi prodotti nel database. Per fare tutto ciò useremo le Tecnologie Web Server Side. 14
Tecnologie Web Server Side Php è un modulo aggiuntivo per web servers che permette di creare delle pagine web dinamiche. Esempi di applicazioni: 1. Contatore accessi, Blog 2. Inserire/Modificare/Leggere dati memorizzati in un database 3. Realizzare un sito di commercio elettronico 4. Programmi gestionali che funzionano via WEB (gestione magazzino, gestione commesse etc) LINK di progetti sviluppati in php: CMS(Content Management System): per creare siti web in modo semplice e automatico. URL: http://www.joomla.it/ Programmi gestionali che funzionano via web: GAFFI - Gestione affitti via WEB: è un programma scritto in PHP eseguibile su server WEB Apache e DBMS Mysql per gestire gli immobili dati in locazione: http://www.devincentiis.it/softgaff.php Software gestione alberghiera: http://www.digitaldruid.net/php-residence/ residence/ Open Source E-Commerce: E http://www.oscommerce.com 15
PREREQUISITI (Structured Query Language) è un linguaggio creato per l'accesso a informazioni memorizzate nei DATABASE. Permette di: 1. Creare tabelle 2. Inserire/Modificare/Cancellare dati in tabelle 3. Definire le relazioni 4. etc Si utilizza insieme ad un linguaggio OSPITE, che nel nostro caso è il PHP. Qualsiasi programma gestionale(software per la gestione di prenotazioni Alberghiere, commercio elettronico, gestione commesse) è basato su un database 16
SERVER CHE SI UTILIZZERANNO è un Database management system (DBMS) relazionale, composto da un client con interfaccia a caratteri e un server, entrambi disponibili sia per sistemi Unix che per Windows, anche se prevale un suo utilizzo in ambito Unix. Apache è il nome dato alla piattaforma server Web più diffusa (ma anche al gruppo di lavoro open source che ha creato, sviluppato e aggiornato il software server), in grado di operare da sistemi operativi UNIX-Linux e Microsoft. 17
EasyPHP è una piattaforma di sviluppo Web, che permette di far funzionare localmente (senza connettersi ad un server esterno) degli script PHP. EasyPHP non è solo un software, ma un ambiente di sviluppo comprendente: 1. due server (un server Web Apache e un server di basi di dati MySQL) 2. un interprete di script PHP 3. un amministratore di database MySQL con interfaccia grafica chiamato phpmyadmin. Dispone di un interfaccia d amministrazione che permette di gestire gli utenti, l avvio e lo spegnimento dei server. Permette di installare in un volta sola tutto il necessario per iniziare lo sviluppo locale di PHP. 18
Il server Apache crea automaticamente di default un dominio virtuale (in locale) all indirizzo di localhost (http://127.0.0.1). EasyPHP può essere utilizzato come applicazione portatile, per esempio attraverso una chiave USB. La versione 2.0 apporta le nuove versioni dei suoi componenti: Apache 2.2.3, PHP 5.2.0, MySQL 5.0.2, PHPMyAdmin 2.9.1.1, SQLiteManager 1.2.0 Il software ha l'enorme vantaggio di installare tutti i software necessari per la progettazione e il funzionamento di un sito web in locale. E' possibile vedere le pagine progettate semplicemente digitando l'indirizzo:http://localhost nella barra degli indirizzi del proprio browser. 19
LINK PhpMyAdmin: http://www.phpmyadmin.net/home_page/index.php EasyPhp: http://easyphp.org/index.php Apache: http://www.apache.org/ MySql: http://www-it.mysql.com/ PHP: http://www.php.net/ 20
COSA DOBBIAMO FARE? Dobbiamo creare un nuovo database dove memorizzare i prodotti trattati dall azienda InfoTech. Questo database sarà composto da due tabelle: la tabella Prodotti e la tabella Categorie. 21
CREAZIONE DEL DATABASE Per creare un nuovo database è necessario accedere a PhpMyAdmin attraverso la seguente procedura: cliccare sull icona E di easyphp e scegliere la voce Amministrazione, oppure aprire il browser e digitare il seguente url: http://127.0.0.1/home/ 22
EASY PHP ADMINISTRATION Questa è una pagina di riepilogo che mostra quali sono i server e moduli installati in EasyPhp. Per gestire il server di database Mysql cliccare su Manage Database 23
phpmyadmin PhpMyAdmin è un tool che permette di gestire l'amministrazione di database MySQL. Scritto in linguaggio PHP permette di gestire tramite web browser i database contenuti in un server mysql. Cliccando sul menu a tendina (Database) è possibile selezionare un database esistente http://openskill.info/topic.php?id=187 Qui è possibile creare un nuovo database. 24
CREAZIONE DEL DATABASE Per il nostro progetto creiamo un database nominato infotechdb Tutte le operazioni che esegue phpmyadmin sono sempre traducibili in linguaggio SQL. 25
CREAZIONE DELLA TABELLA CATEGORIE Un database è composto da una o più tabelle. Per creare una nuova tabella, compilare la maschera presenta in crea una nuova tabella nel database infotechdb. 26
Inserimento dei campi Una tabella è composta da uno o più campi (colonne). Ogni tabella dovrebbe avere un campo di tipo chiave primaria che identifica in maniera univoca ogni record(riga) della tabella. Inoltre la chiave primaria viene utilizzata per creare relazioni tra tabelle. Per definire un campo di tipo chiave primaria, mettere la spunta sul simbolo della 27 chiave.
Inserimento dei campi La tabella Categoria è composta da due campi: IDCategorie e Nome. Per ogni campo bisogna specificare quale tipo di dato conterrà, un po come le variabili. Il campo IDCategoria sarà la chiave primaria della tabella Categorie, è di tipo INT e si auto incrementa da solo. Cliccare su Salva per confermare la creazione della tabella. Guida sul linguaggio SQL: http://database.html.it/guide/leggi/40/guida-linguaggio-sql/ 28
CREAZIONE della tabella CATEGORIE PhpMyAdmin mostra sempre il codice SQL utilizzato per creare la tabella. Cliccare su infotechdb 29
CREAZIONE della tabella PRODOTTI E possibile creare altre tabelle compilando la maschera Crea una nuova tabella del database infotechdb Creiamo la tabella prodotti composta da 7 campi e clicchiamo sul pulsante Esegui. 30
CREAZIONE dei campi della tabella prodotti In questo caso il campo IDProdotti sarà la chiave primaria della tabella prodotti. Notare che il campo Descrizione è stato impostato di tipo LONGTEXT. 31
CREAZIONE dei campi della tabella prodotti Notare che il campo foto non contiene l immagine, ma solo il nome dell immagine o il suo percorso. Questo perché in genere le immagini si salvano all interno di cartelle e sul database si salva solo il nome. 32
CREAZIONE dei campi della tabella prodotti Cliccando su Salva viene creata la tabella Prodotti e viene mostrato il codice SQL generato. 33
CREAZIONE delle pagine dinamiche A questo punto la fase di creazione del database è terminata. Ora dobbiamo costruire le nostre pagine dinamiche in linguaggio PHP. Partiamo dal BACK-END ovvero costruiamo le pagine per inserire un nuovo prodotto o una nuova categoria nel database. Creiamo in C:\Program Files\EasyPHP1-8\www una cartella di nome infotech e al suo interno memorizzeremo tutti i file del sito. Per accedere al sito sarà sufficiente digitare nella barra degli indirizzi: http://127.0.0.1/infotech/ 34
La sezione Amministrativa Creiamo un file php nominato admin.php Questa sezione è semplice, l unica cosa un po particolare è che il menu lo includiamo dinamicamente attraverso l istruzione php include. <? include "menu.inc";?> Questo è il contenuto del file menu.inc: <a class='admin' href='nuovo_prodotto.php'>nuovo PRODOTTO</a> <a class='admin' href='nuova_categoria.php'>nuova CATEGORIA</a> <a class='admin' href='index.php'>home PAGE</a> In questo modo possiamo includere il menu in tutte le pagine della sezione amministrazione. Questo sistema ha il vantaggio di offrire un facile aggiornamento delle voci del menu poiché basta aggiornare un unico file e tutte le pagine di amministrazione si aggiornano di conseguenza. 35
La sezione Amministrativa Ecco il listato di codice per creare la pagina admin.php Notare come il codice PHP si mischi con il codice HTML. <HTML> <HEAD> <TITLE>HOME PAGE - INFOTECH IL TUO NEGOZIO DI INFORMATICA ONLINE</TITLE> <LINK rel="stylesheet" href='stile.css'> </HEAD> <BODY> <IMG src='img/testata.jpg'> <H1>INFOTECH IL TUO NEGOZIO DI INFORMATICA ONLINE</H1> <H2>SEZIONE AMMINISTRATIVA</H2> <a href='admin.php'><img src='img/area_amministrativa.jpg'></a><br><br> <p style='width:600px;text-align:justify;font-family:tahoma,verdana,sans-serif;border:1px solid black;'> Benvenuto nell'area amministrativa di <b>infotech.</b><br><br> Tramite il <b>menu</b> sottostante avrai la possibilità di aggiornare la tua banca dati online inserendo <b>nuovi prodotti</b> o <b>nuove categorie</b> compilando le apposite interfacce web. </p> <!-- INCLUDO IL MENU DELLA SEZIONE AMMINISTRATIVA --> <? include "menu.inc" menu.inc";?> <br><br> <IMG src='img/pie_di_pagina.jpg'> </BODY> </HTML> 36
La pagina di inserimento di una nuova categoria Creiamo un file php nominato nuova_categoria.php La parte più importante di questa pagina è la maschera di inserimento di un nuova categoria. <FORM action='inserisci_categoria.php' method='get'> <TABLE> <TR> <TD class='newp'>nome Nuova Categoria</TD> <TD><INPUT type='text' name='nome_categoria nome_categoria'></td> </TR> <TR> <TD><INPUT type='reset' value='azzera'> <TD><INPUT type='submit' value='inserisci CATEGORIA'></TD> </TR> </TABLE> </FORM> E importante impostare l attributo name del tag INPUT, perché è in base a quel valore che faremo riferimento al testo digitato all interno della casella di testo tramite PHP. Prestare attenzione anche al metodo di invio del form, in questo caso è il metodo GET. 37
Listato pagina nuova_categoria.php <HTML> <HEAD> <TITLE>INSERISCI UNA NUOVA CATEGORIA</TITLE> <LINK rel="stylesheet" href='stile.css'> </HEAD> <BODY> <IMG src='img/testata.jpg'> <H1>INFOTECH IL TUO NEGOZIO DI INFORMATICA ONLINE</H1> <H2>SEZIONE AMMINISTRAZIONE</H2> <? include "menu.inc"?> <H3>INSERISCI UNA NUOVA CATEGORIA</H3> <FORM action='inserisci_categoria.php' method='get'> <TABLE> <TR> <TD class='newp'>nome Nuova Categoria</TD> <TD><INPUT type='text' name='nome_categoria'></td> </TR> <TR> <TD><INPUT type='reset' value='azzera'> <TD><INPUT type='submit' value='inserisci CATEGORIA'></TD> </TR> </TABLE> </FORM> <br><br> <IMG src='img/pie_di_pagina.jpg'> </BODY> </HTML> 38
La pagina che salva una nuova categoria Creiamo un file php nominato inserisci_categoria.php. Il primo passo di questo script è quello di leggere il valore digitato nella casella di testo nominata nome_categoria della pagina nuova_categoria.php Siccome il form invia i dati attraverso il metodo GET, per leggerlo si usa l array associativo $_GET Costruisco la query SQL che mi permette di inserire una nuova categoria. <?php $nome_cat=$_get["nome_categoria"]; include "database.inc"; $query="insert INTO Categorie(Nome) VALUES('$nome_cat')"; mysql_query($query) or die("query fallita: ".mysql_error()); Eseguo la query. 39
Listato pagina inserisci_categoria.php <HTML> <HEAD> <TITLE>AREA AMMINISTRATIVA - INSERISCI CATEGORIA</TITLE> <LINK rel="stylesheet" href='stile.css'> </HEAD> <BODY> <IMG src='img/testata.jpg'> <H1>INFOTECH IL TUO NEGOZIO DI INFORMATICA ONLINE</H1> <a href='admin.php'><img src='img/area_amministrativa.jpg'></a><br> <? include "menu.inc"?> <?php $nome_cat=$_get["nome_categoria"]; include "database.inc"; $query="insert INTO Categorie(Nome) VALUES('$nome_cat')"; mysql_query($query) or die("query fallita: ".mysql_error()); echo "<br><br><strong>inserimento AVVENUTO CON SUCCESSO</strong><br><br>"; mysql_close($connessione);?> <br><br> <IMG src='img/pie_di_pagina.jpg'> </BODY> </HTML> 40
La pagina di inserimento di un nuovo prodotto Creiamo un file php nominato nuovo_prodotto.php La parte più importante di questa pagina è la maschera di inserimento di un nuovo prodotto. Il menu a tendina categoria è compilato in modo dinamico leggendo il contenuto della tabella categorie. Quindi sarà necessario stabilire una connessione con il server di database MySql. Siccome le pagine dinamiche in genere stabiliscono una connessione con il server di database allora si crea un file esterno nominato database.inc che include le istruzioni per collegarsi al server di database. <? /* Stabiliamo la connesione verso il server di Database Mysql */ $connessione= mysql_connect("localhost", "root", "") or die("connessione nn risucita: ". mysql_error()); /** Selezioniamo il database datidb **/ mysql_select_db("infotechdb") or die("selezione database non avvenuta");?> 41
La pagina di inserimento di un nuovo prodotto <? /* Stabiliamo la connesione verso il server di Database Mysql */ $connessione= mysql_connect("localhost", "root", "") or die("connessione nn risucita: ". mysql_error()); /** Selezioniamo il database datidb **/ mysql_select_db("infotechdb") or die("selezione database non avvenuta");?> Descrizione delle funzioni PHP utilizzate: mysql_connect stabilice una connessione ad un server MySQL. Il primo parametro indica l indirizzo del server, il secondo la username, il terzo la password (in questo caso la password è nulla). mysql_select_db seleziona un database MySQL. Accetta come parametro il nome del database con cui si desidera lavorare. mysql_error Restituisce il testo dell'errore dall'ultima funzione MySQL, oppure '' (la stringa vuota) se nessun errore intercorre. Gli errori ritornano dal database MySQL senza visualizzare i messaggi di avvertimento. Si usa invece mysql_error() per recuperare il testo dell'errore. die equivale alla funzione exit. Interrompe l esecuzione dello script e stampa il messaggio specificato. Elenco di tutte le funzioni mysql: http://www.php.net/manual/it/ref.mysql.php 42
La pagina di inserimento di un nuovo prodotto Le funzioni più importanti di questa fase sono: mysql_query() invia una query al database selezionato Solo per le istruzioni SELECT mysql_query() restituisce un identificativo di risorsa o FALSE se la query non è stata eseguita correttamente. Per altri tipi di istruzioni SQL(UPDATE,DELETE,INSERT) mysql_query() restituisce TRUE in caso di successo e FALSE in caso di errore. <SELECT name='categoria_prodotto'> <!-- I VALORI LI LEGGIAMO DALLA TABELLA CATEGORIE --> <? include "database.inc"; $query="select IDCategorie, Nome FROM CATEGORIE"; $risultato=mysql_query($query) or die("errore nella query". mysql_error()); while($riga=mysql_fetch_array($risultato,mysql_assoc)){ echo "<OPTION value=". $riga['idcategorie']. ">". $riga['nome']. "</OPTION>\n"; </SELECT>?> } mysql_free_result($risultato); mysql_close($connessione); 43
La pagina di inserimento di un nuovo prodotto mysql_fetch_array: restituisce un array che corrisponde alla riga caricata o FALSE se non ci sono più righe. Si utilizza quando si lavora con un istruzione SQL di tipo SELECT che puo restituire 0, 1 o più righe di una tabella. Questa funzione ci permette di scorrere riga per riga la tabella. Il ciclo while continua finché non è diverso da FALSE. Si potrebbe anche scrivere così: $riga=mysql_fetch_array($risultato,mysql_assoc); while($riga!=false){ echo.. ; $riga=mysql_fetch_array($risultato,mysql_assoc); } <SELECT name='categoria_prodotto'> <!-- I VALORI LI LEGGIAMO DALLA TABELLA CATEGORIE --> <? include "database.inc"; $query="select IDCategorie, Nome FROM CATEGORIE"; $risultato=mysql_query($query) or die("errore nella query". mysql_error()); while($riga=mysql_fetch_array($risultato,mysql_assoc)){ echo "<OPTION value=". $riga['idcategorie']. ">". $riga['nome']. "</OPTION>\n"; </SELECT>?> } mysql_free_result($risultato); mysql_close($connessione); 44
La pagina di inserimento di un nuovo prodotto mysql_fetch_array è una versione estesa di mysql_fetch_row(). Oltre a memorizzare i dati del risultato in array con indice numerico, questa li memorizza anche con indici associativi usando i nomi dei campi come chiavi. Il secondo argomento opzionale tipo_risultato in mysql_fetch_array() è una costante e può assumere i seguenti valori: MYSQL_ASSOC, MYSQL_NUM e MYSQL_BOTH. Usando MYSQL_BOTH, si ottiene un array con entrambe gli indici (associativo e numerico). Usando MYSQL_ASSOC, si ottengono solo gli indici associativi, usando MYSQL_NUM, si ottengono solo gli indici numerici <SELECT name='categoria_prodotto'> <!-- I VALORI LI LEGGIAMO DALLA TABELLA CATEGORIE --> <? include "database.inc"; $query="select IDCategorie, Nome FROM CATEGORIE"; $risultato=mysql_query($query) or die("errore nella query". mysql_error()); while($riga=mysql_fetch_array($risultato,mysql_assoc)){ echo "<OPTION value=". $riga['idcategorie']. ">". $riga['nome']. "</OPTION>\n"; </SELECT>?> } mysql_free_result($risultato); mysql_close($connessione); 45
La pagina di inserimento di un nuovo prodotto Notare che come <option value è impostata la chiave primaria della tabella categoria. Mentre poi viene visualizzata il nome della categoria. Questo perché il form invia poi il valore della chiave primaria e non il nome della categoria. In questo modo nella tabella prodotti si salva la chiave primaria della tabella categoria e si imposta la relazione tra le due tabelle. mysql_free_result() libera tutta la memoria associata. mysql_free_result() deve essere richiamata solo se si è preoccupati sulla quantità di memoria usata dalle query che restituiscono dei grandi risultati. Tutta la memoria associata al risultato è automaticamente liberata al termine dell'esecuzione dello script. <SELECT name='categoria_prodotto'> <!-- I VALORI LI LEGGIAMO DALLA TABELLA CATEGORIE --> <? include "database.inc"; $query="select IDCategorie, Nome FROM CATEGORIE"; $risultato=mysql_query($query) or die("errore nella query". mysql_error()); while($riga=mysql_fetch_array($risultato,mysql_assoc)){ echo "<OPTION value=". $riga['idcategorie']. ">". $riga['nome']. "</OPTION>\n"; </SELECT>?> } mysql_free_result($risultato); mysql_close($connessione); 46
Listato pagina nuovo_prodotto.php <HTML> <HEAD> <TITLE>INSERISCI UN NUOVO PRODOTTO</TITLE> <LINK rel="stylesheet" href='stile.css'> </HEAD> <BODY> <IMG src='img/testata.jpg'> <H1>INFOTECH IL TUO NEGOZIO DI INFORMATICA ONLINE</H1> <H2>SEZIONE AMMINISTRAZIONE</H2> <? include "menu.inc"?> <H3>INSERISCI UN NUOVO PRODOTTO</H3> <!-- CREIAMO IL FORM PER L'INSERIMENTO DEI DATI --> <FORM action='inserisci_prodotto.php' method='post'> <TABLE class='inserimento'> <!-- SELEZIONIAMO LA CATEGORIA --> <TR> <TD class='newp'>categoria</td> 47
Listato pagina nuovo_prodotto.php <TD> <SELECT name='categoria_prodotto'> <!-- I VALORI LI LEGGIAMO DALLA TABELLA CATEGORIE --> <? include "database.inc"; $query="select IDCategorie, Nome FROM CATEGORIE"; $risultato=mysql_query($query) or die("errore nella query". mysql_error()); while($riga=mysql_fetch_array($risultato,mysql_assoc)){ echo "<OPTION value=". $riga['idcategorie']. ">".$riga['nome']."</option>\n"; } mysql_free_result($risultato); mysql_close($connessione);?> </SELECT> </TD> </TR> <TR> <TD class='newp'>nome:</td> <TD><INPUT type='text' name='nome_prodotto' size='30'></td> </TR> <TR> <TD class='newp'>descrizione:</td> <TD><TEXTAREA name='descr_prodotto'></textarea></td> </TR> <TR> <TD class='newp'>qta:</td> <TD><INPUT type='text' name='qta_prodotto' size='4'></td> </TR> 48
Listato pagina nuovo_prodotto.php <TR> <TD class='newp'>prezzo:</td> <TD><INPUT type='text' name='prezzo_prodotto' size='4'></td> </TR> <TR> <TD class='newp'>foto:</td> <TD><INPUT type='text' name='foto_prodotto' size='30'></td> </TR> <TR> <TD class='newp'><input type='reset' VALUE='CANCELLA'></TD> <TD><INPUT type='submit' VALUE='INSERISCI PRODOTTO'></TD> </TR> </TABLE> </FORM> <IMG src='img/pie_di_pagina.jpg'> </BODY> </HTML> 49
La pagina che salva il prodotto nel database Il compito principale della pagina inserisci_prodotto.php è quello di raccogliere i dati inseriti nel form della pagina nuovo_prodotto.php e di memorizzarli all interno di apposite variabili. Siccome i dati sono stati inviati con il metodo POST per leggere i valori si usa l array associativo $_POST. <?php $nome_prod=$_post["nome_prodotto"]; $cat_prod=$_post["categoria_prodotto"]; $descr=$_post["descr_prodotto"]; $quantita=$_post["qta_prodotto"]; $prezzo=$_post["prezzo_prodotto"]; $foto=$_post["foto_prodotto"]; 50
La pagina che salva il prodotto nel database La fase successiva è quello di stabilire la connessione al database. Sicome dobbiamo salvare un nuovo prodotto nel database creeremo una query di tipo inserimento e la eseguiremo tramite la funzione php mysql_query. include "database.inc"; $query="insert INTO Prodotti(Nome,Categoria,Descrizione,Qta,Prezzo,Foto) VALUES('$nome_prod','$cat_prod','$descr',$quantita,$prezzo,'$foto')"; mysql_query($query) or die("query fallita: ".mysql_error()); 51
Listato pagina inserisci_prodotto.php <HTML> <HEAD> <TITLE>AREA AMMINISTRATIVA - INSERISCI PRODOTTO</TITLE> <LINK rel="stylesheet" href='stile.css'> </HEAD> <BODY> <IMG src='img/testata.jpg'> <H1>INFOTECH IL TUO NEGOZIO DI INFORMATICA ONLINE</H1> <a href='admin.php'><img src='img/area_amministrativa.jpg'></a> <?php $nome_prod=$_post["nome_prodotto"]; $cat_prod=$_post["categoria_prodotto"]; $descr=$_post["descr_prodotto"]; $quantita=$_post["qta_prodotto"]; $prezzo=$_post["prezzo_prodotto"]; $foto=$_post["foto_prodotto"]; Questo va tutto su un unica riga include "database.inc"; $query="insert INTO Prodotti(Nome,Categoria,Descrizione,Qta,Prezzo,Foto) VALUES('$nome_prod','$cat_prod','$descr',$quantita,$prezzo,'$foto')"; mysql_query($query) or die("query fallita: ".mysql_error()); echo "<br><br><strong>inserimento AVVENUTO CON SUCCESSO</strong><br><br>"; mysql_close($connessione);?> <br> <IMG src='img/pie_di_pagina.jpg'> </BODY> </HTML> 52
Il catalogo prodotti Creiamo un file nominato prodotti.php I prodotti sono suddivisi per categorie, in questo caso abbiamo 5 categorie(chiavette, SCHEDE VIDEO, HARD DISK, PORTATILI, SCHEDE AUDIO). Per visualizzare i prodotti che appartengono a una categoria è necessario cliccare sulla voce corrispondente nel menu a sinistra. La cosa più importante di questa pagina è che riceve sempre un parametro nominato id. Notare la URL nella barra degli indirizzi: http://127.0.0.1/infotech/prodotti.php?id=1 Il parametro id in questo caso identifica la categoria. Questo significa che le voci del menu delle categorie a sinistra sono composte nel modo seguente: Ogni volta che clicchiamo su una categoria, richiamiamo sempre la pagina prodotti.php e gli passiamo l idl della categoria che desideriamo visualizzare. <a href= prodotti.php prodotti.php?id=1 >CHIAVETTE</a> <a href= prodotti.php prodotti.php?id=2 >SCHEDE VIDEO</a> <a href= prodotti.php prodotti.php?id=3 >HARD DISK</a> E così via.. 53
Il catalogo prodotti Come prima cosa componiamo il menu delle categorie: Notare come si compone ogni collegamento ipertestuale. include "database.inc"; $query_cat="select * FROM Categorie"; $risult_cat=mysql_query($query_cat) or die("errore nella query". mysql_error()); while($riga=mysql_fetch_array($risult_cat,mysql_assoc)){ echo "<A href='prodotti.php?id=". $riga['idcategorie']. "'>". $riga['nome']. "</a> <br>"; } 54
Il catalogo prodotti Successivamente mostriamo i prodotti che appartengono alla categoria selezionata. Quindi come prima cosa dobbiamo leggere il parametro id passato alla pagina secondo questo formato prodotti.php?id=3 E facile notare che questo modo di passare i parametri è identico a quello utilizzato dai form con il metodo GET. Di conseguenza nella pagina prodotti.php per sapere qual è la categoria selezionata useremo un codice simile al seguente: $categoria_selezionata=$_get[ id id ]; Ora costruiamo una query di selezione con un vincolo,, cioè vogliamo SELEZIONARE tutti i prodotti dalla tabella PRODOTTI DOVE la categoria è uguale a $categoria_selezionata. Questo in linguaggio SQL si traduce in un istruzione come la seguente: SELECT * FROM Prodotti WHERE Categoria= $categoria_selezionata $categoria_selezionata In questo caso l asterisco l indica prendi tutti i campi della tabella. $categoria_selezionata=$_get['id']; $query="select * FROM Prodotti WHERE Categoria=$categoria_selezionata"; $risult_prod=mysql_query($query) or die("errore nella query". mysql_error()); 55
Il catalogo prodotti A questo punto non ci resta che impaginare i risultati. Notare come è inserita la foto del prodotto. echo "\n\t<td> <img src='foto/". $riga['foto']. "'></td>"; In questo esempio tutte le immagini dei prodotti sono memorizzati i all interno della cartella foto presente in C:\Program Files\EasyPHP1 EasyPHP1-8\www\INFOTECH\foto e sul database si salva solo il nome dell immagine immagine. Per farla visionare nella pagina si utilizza il tag HTML IMG. echo "<table>"; echo "<tr><th>foto</th><th>nome</th><th>descrizione</th><th>qta</th><th>prezzo</th></tr>"; while($riga=mysql_fetch_array($risult_prod,mysql_assoc)){ echo "\n\t<tr>"; echo "\n\t<td> <img src='foto/". $riga['foto']. "'></td>"; echo "\n\t<td>". $riga['nome']. "</td>"; echo "\n\t<td width=200px> ". $riga['descrizione']. "</td>"; echo "\n\t<td> ". $riga['qta']. "</td>"; echo "\n\t<td align='right'><b><span style='color:red'>". $riga['prezzo']. " </span></b></td>"; echo "</tr>"; } echo "</table>"; 56
Listato pagina prodotti.php Nota per testare questa pagina è necessario richiamarla nel modo seguente: http://localhost/infotechdb/prodotti.php?id=1 <HTML> <HEAD> <TITLE>HOME PAGE - INFOTECH IL TUO NEGOZIO DI INFORMATICA ONLINE</TITLE> <LINK rel="stylesheet" href='stile.css'> </HEAD> <BODY> <IMG src='img/testata.jpg'> <H1>INFOTECH IL TUO NEGOZIO DI INFORMATICA ONLINE</H1> <a href='admin.php'><img src='img/area_amministrativa.jpg'></a> <H2>ELENCO PRODOTTI</H2> <table> <tr> <td valign='top' width=150 class='categorie'> <? include "database.inc"; $query_cat="select * FROM Categorie"; $risult_cat=mysql_query($query_cat) or die("errore nella query". mysql_error()); while($riga=mysql_fetch_array($risult_cat,mysql_assoc)){ echo "<A href='prodotti.php?id=". $riga['idcategorie']. "'>". $riga['nome']. "</a> <br>"; } echo "</td><td valign='top'>"; $categoria_selezionata=$_get['id']; $query="select * FROM Prodotti WHERE Categoria=$categoria_selezionata"; $risult_prod=mysql_query($query) or die("errore nella query". mysql_error()); 57
Listato pagina prodotti.php echo "<table>"; echo "<tr><th>foto</th><th>nome</th><th>descrizione</th><th>qta</th><th>prezzo</th></tr>"; while($riga=mysql_fetch_array($risult_prod,mysql_assoc)){ echo "\n\t<tr>"; echo "\n\t<td> <img src='foto/". $riga['foto']. "'></td>"; echo "\n\t<td>". $riga['nome']. "</td>"; echo "\n\t<td width=200px> ". $riga['descrizione']. "</td>"; echo "\n\t<td> ". $riga['qta']. "</td>"; echo "\n\t<td align='right'><b><span style='color:red'>". $riga['prezzo']. " </span></b></td>"; echo "</tr>"; } echo "</table>"; mysql_free_result($risult_cat); mysql_free_result($risult_prod);?> </td> </tr> </table> <IMG src='img/pie_di_pagina.jpg'> </BODY> </HTML> 58
La pagina index.php Questa pagina è semplice, l unica cosa importante è che il collegamento CONSULTA IL CATALOGO punta al file prodotti.php. Ma abbiamo visto nelle slide precedenti che bisogna passare un parametro a questa pagina, quindi il link dovrà essere composto nel modo seguente: <a href= prodotti.php?id=1 >CONSULTA IL CATALOGO</a> 59
Listato pagina index.php <HTML> <HEAD> <TITLE>HOME PAGE - INFOTECH IL TUO NEGOZIO DI INFORMATICA ONLINE</TITLE> <LINK rel="stylesheet" href='stile.css'> </HEAD> <BODY> <IMG src='img/testata.jpg'> <H1>INFOTECH IL TUO NEGOZIO DI INFORMATICA ONLINE</H1> <a href='admin.php'><img src='img/area_amministrativa.jpg'></a> <H2>PAGINA DI PRESENTAZIONE</H2> <p style='width:700px;align:justidy;font-family:tahoma,verdana,sans-serif'> Benvenuti nel sito dell'azienda INFOTECH. Qui troverai prodotti di informatica di ultima generazione a prezzi imbattibili. Siamo i primi in Italia e trattiamo i nostri prodotti anche con l'estero. Consulta il nostro catalogo online cliccando sulla voce sottostante: </p> <a href='prodotti.php?id=1'>consulta IL CATALOGO</a> <br><br> <IMG src='img/pie_di_pagina.jpg'> </BODY> </HTML> 60
Il file stile.css /* CSS Document */ h1{ width:800px; font-family:tahoma,verdana,sans-serif; font-size:16px; background-color:#ffff99; } h2{ width:800px; font-family:tahoma,verdana,sans-serif; font-size:14px; background-color:#ffff99; } h3{ width:800px; font-family:tahoma,verdana,sans-serif; font-size:12px; background-color:#ffff99; } table{ font-family:tahoma,verdana,sans-serif; font-size:12px; } td.newp{ background:#cccccc; font-weight:bold; } 61
Il file stile.css td.categorie{ color:#ffffff; background-color:#9cab10; } td.categorie a{ color:#ffffff; padding-left:5px; } 62