Il nostro sito in ASP con connessione database Access

[tonertemplum]

CLICCANDO QUI E' POSSIBILE VEDERE IN TEMPO REALE LE ESERCITAZIONI CHE FAREMO E SCARICARE I VARI PROGRESSI

Qui invece il topic per richieste di aiuto, suggerimenti, altro.....

http://forum.amdplanet.it/viewtopic.php?p=226786#226786

Per i file HTML, per vederli correttamente, potete anche riferirvi qui all'appendice...

http://forum.amdplanet.it/viewtopic.php?p=227262#227262




INTRODUZIONE


Sollecitato da più parti, da stasera cominceremo a vedere da vicino le "famose" pagine ASP...

Cosa faremo? Creeremo insieme un sito dinamico (cioè non preparato da noi, ma che si aggiorna da solo a seconda dei contenuti presenti in un database) e impareremo a inserire via web tali informazioni nel db (=database) e a richiamarle con un'altra interfaccia web.

Cosa useremo? Ci occorrerà un editor di pagine html (o nel nostro caso asp); un programma FTP (File Transfer Protocol, ci servirà per trasferire i nostri file da locale a remoto); Office Access e uno spazio web che supporti ASP. Per questa ultima parte, non me ne vogliano i mod, ho trovato molto carino questo sito

http://www.somee.com/Signup.aspx

una volta registrati avremo il nostro bel sito chiamato.... "nomesito.somee.com" (nel mio caso, indovinate? webtemplum.somee.com lol )

[tonertemplum]

CAPITOLO 1: CONFIGURAZIONE DEL PROGRAMMA FTP

Qualunque esso sia, il programma FTP va configurato: niente di + semplice. Dovremo inserire:

-->nome utente (lo abbiamo scelto prima; nel mio caso è "webtemplum");
-->password (e questa la sapete voi )
-->indirizzo ftp: è semplice; nomevostrosito.somee.com

Una volta che avremo inserito le credenziali vedremo, come in esplora risorse di windows, una cartellina chiamata "nomevostrosito.somee.com"... questa sarà come la cartellina che avete sul vostro hard disk del vostro sito internet... mi raccomando, rispettate tutti i percorsi e tutti i files devono essere copiati a partire da quella cartellina... non mettete nulla fuori oppure il sito non funzionerà!

[tonertemplum]

CAP. 2: CONFIGURAZIONE DI DREAMWEAWER

Una volta installato Dreamweawer, si aprirà una paginetta chiamata "modifica siti"... seguite i miei passi

01 - Cliccate su "nuovo..."
02 - Nella finestra "come si desidera chiamare il sito?" diamogli un nome, ad esempio "sitoinasp" oppure tanto meglio chiamatelo come il vostro spazio (nel mio caso webtemplum.somee.com);
03 - Alla domanda se volete usare una tecnologia server rispondete di NO (lo so che è un controsenso... ) e cliccate su AVANTI;
04 - Nella prossima finestra dobbiamo scegliere dove salvare il nostro sito - scegliamo il percorso che vogliamo e clicchiamo su avanti;
05 - Nella prossima finestra scegliamo Locale/Rete e clicchiamo nuovamente sulla cartellina fino a ritrovare nuovamente il nostro sito internet;
06 - Clicchiamo su avanti e spuntiamo "No, non abilitare il deposito e il ritiro dei files";
07 - Nella prossima (e ultima finestra) vedremo un riepilogo di tutte le informazioni inserite: confermiamo con "FINE".

Fatto, abbiamo configurato il nostro Dreamweawer, tant'+ che nell'elenco di sinistra troveremo tendenzialmente tutti i nostri file che costruiremo con tutte le cartelline varie.... di questo parleremo nel prossimo capitolo!

[tonertemplum]

CAP. 3: CONSIGLI SU COME ORGANIZZARE LE CARTELLE DEL NOSTRO SITO

Non è vincolante, ma è un consiglio che vi do spassionatamente.... Do per scontato che abbiate in mente la gerarchia ad albero delle cartelle di windows.... io personalmente faccio questa cosa:

Premessa: sto realizzando il sito http://www.webtemplum.com

Creo la cartella che conterrà tutto il sito e la chiamo webtemplum.com;
all'interno di questa cartella saranno contenuti solo i file principali (come l'index, chi siamo etc etc etc) ; poi creo diverse sottocartelle "standard" così strutturate:

- images (conterrà tutte le immagini del sito, a sua volta divisa in templates [che conterrà tutte le immagini che fanno la struttura del sito], buttons [conterrà solo i bottoni] etc etc etc);
- css (conterrà tutti i fogli di stile, o CSS appunto, che servono a impostare graficamente la pagina senza lavorare direttamente su ogni HTML - vedremo poi in seguito)
- db (banalmente, conterrà i databases che ci serviranno)
- script (se la pagina contiene degli script, io li metto qua dentro, così me li divido e li trovo subito dagli altri)

Ripeto, non è necessario fare questo, ma sicuramente un po' di organizzazione aiuta quando dopo diversi mesi dobbiamo correggere/modificare/aggiornare qualcosa


nel nostro caso, ecco come è organizzata la struttura del nostro sito....

[tonertemplum]

CAP. 4: IL PROGETTO

Bene, cosa faremo con asp e access? Vi illustro il progetto che seguiremo:

Scenario: ci troviamo in una società di telemarketing. La teleseller chiama e fissa appuntamenti. Deve riempire una scheda con il nome della persona con cui ha preso appuntamento, indirizzo, telefono, interesse, etc etc etc....

Dall'altra parte c'è l'amministratore che tramite interfaccia web vede tutti gli appuntamenti presi, li assegna a un determinato commerciale, vede quanti appuntamenti in un dato mese ha preso la teleseller, quanti appuntamenti ha dato a quella persona.... modifica un appuntamento o lo cancella se è stato annullato.....

E' un progetto che può essere poi largamente modificato e riadattato ai propri scopi, IMHO.... cominceremo dal creare il Database, per poi caricarlo on line e creare la maschera web per inserire i dati.... Buon lavoro a tutti

[nemesys_72]

bene bene..
ma va con calma che son lento io..

[tonertemplum]

bene bene..
ma va con calma che son lento io..

tranqui, riprenderemo mercoled' con la creazione intanto del database access..... prima non ce la faccio coi tempi

[nemesys_72]

orrimo, intanto valorizzo..

[Jamaicano]

spettacolo, se risco ad organizzarmi per seguirlo domani prendo il dominio e configuro l'ftp che almeno ste cose le so fare.

[tonertemplum]

wow... importante!!!! GRAZIE!!! raga, una cosa, che ne dite però a sto punto di lasciare questo topic libero e aprirne un altro per consigli, richieste, suggerimenti, richiete di aiuto? va, lo apro io.....

http://forum.amdplanet.it/viewtopic.php?p=226786#226786

[tonertemplum]

CAP. 5: IL DATABASE



Non me ne vogliate per la dimensione dell'immagine, ma volevo essere il più chiaro possibile

Allora, con Access cominciamo a preparare il nostro Database.


1 - chiamiamolo "appuntamenti.mdb" e salviamolo nella cartella db (mi raccomando, d'ora in avanti se volete cambiare cartella ai miei riferimenti sostituite i vostri, altrimenti non funzionerà nulla ). La cartella db si troverà subito sotto la directory principale del sito - nel nostro caso specifico sarà nomemiosito.somee.com/db -

2 - creiamo una tabella al suo interno chiamata appuntamenti e creiamo i campi che vediamo in figura. Unica attenzione da prestare il campo "note" che ho specificato di lunghezza 255, cosi da avere flessibilità nell'inserire una breve nota appunto durante la compilazione della scheda da parte della teleseller. Gli altri campi sono tutti banali e (non credo) necessitano di commenti; in caso contrario li analizziamo poi insieme

3 - Mi raccomando anche il campo ID, messo come chiave primaria (tasto destro sul campo e scelto <<chiave>>. Sarà lui che ci permetterà di lavorare poi sui nostri record! Infatti automaticamente assegnerà un ID numerico univoco a ogni record presente nel database (un record è l'insieme di tutti i valori su una riga, come dire, un nome, una via, un civico, una nota, etc etc etc su una riga sola fanno un record). Potevamo chiamarlo come desideravamo, se volete cambiarlo, prestate molta attenzione e ricordatevi sempre il nome che avete dato!

Se avete la possibilità, stampatevi l'immagine e tenetevela poi come riferimento: ci occorrerà infatti ricordare *precisamente* tutti i nomi dei campi per permettere l'inserimento degli stessi da maschera web

Nella prossima lezione infatti preparamo il nostro file "teleseller.asp" con tutti i campi x l'immissione di testo, pronti per popolare il database!

Alla prossima!

[tonertemplum]

CAP. 6: LA MASCHERA INSERIMENTO DATI

Abbiamo creato il database, messo al suo posto... ora cominciamo a creare la pagina "inserisci.asp" che, come dice anche il nome, ci permetterà di inserire nel database i dati anagrafici dell'appuntaento che abbiamo preso.

COme funziona? Tale pagina, dopo aver preso i dati contenuti nelle varie text area, li passerà a un'altra pagina, contenuta dentro script_teleseller, chiamata "inserisci_appuntamento.asp" la quale si occuperà di fare diversi controlli e inserire i dati alla fin fine nel database.

sul sito di prova webtemplum.somee.com potete già vedere la paginetta costruita (non ho badato tanto alla struttura grafica). Una avvertenza: c'è una checkbox che va spuntata per premere il tasto INVIO: questo per evitare che premendo enter inavvertitamente sulla tastiera l'appuntamento venga salvato così com'è.


Apriamo dreamweawer; creiamo nella pagina 5 tabelle:

1 - Dati anagrafici: 4 colonne x 4 righe
2 - Data e ora appuntamento: 2 x 2
3 - Interesse: 2 x 2
4 - Dati controllo teleseller: 2 x 2
5 - Pulsantiera: 2 colonne x 1 riga.

Dobbiamo ora inserire le textarea che ci permetteranno di scrivere i dati richiesti e per i valori fissi (giorno, mese, anno, etc etc etc) usiamo dei menu a tendina.

A Cosa dobbiamo stare attenti? A questa cosa qui che vi ho evidenziato in rosso:





Praticamente ogni casella di testo, ogni textarea, menu etc etc deve avere un nome UNIVOCO e possibilmente UGUALE ai campi del database che abbiamo costruito. Ho quindi da dreamweawer selezionato con un click il menu a discesa, e con la finestra proprietà che si trova in basso ho modificato il valore evidenziato in rosso. Sarà molto + semplice in seguito andare a recuperare tali campi nell'altra pagina... ma procediamo x gradi, questo diventerà chiaro quando costruiremo la pagina di inserimento dati nel database

Ora andiamo invece ad analizzare e commentare insieme il codice HTML/ASP della pagina "inserisci.asp"....

Codice: Seleziona tutto

<html>
<head>
<title>Inserimento Appuntamento - Corso ASP</title>
<link href="css/testo.css" rel="stylesheet" type="text/css">


intestazioni classiche di HTML.....

Codice: Seleziona tutto

<script language="JavaScript" type="text/javascript">
<!--
function abilita(aBool) {
document.getElementById('pulsante').disabled = ! aBool;
} // function abilita(aBool)
//-->
</script>



Con questo script ho praticamente detto che il pulsante "INVIO" deve essere disabilitato finche non viene flaggato, questo per evitare che venga inserito un appuntamento "a metà" premendo enter x sbaglio

Codice: Seleziona tutto

</head>
<body>
<table width="526" height="99" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td height="99">
      <div align="center"><img src="images/top.png" width="526" height="99"></div></td>
  </tr>
</table>



Codice: Seleziona tutto

<form action="script_teleseller/inserisci_appuntamento.asp" method="post" name="form1" class="testo">


Nella pagina abbiamo creato un FORM, praticamente un contenitore di moduli e bottoni INVIA / RIPRISTINA; tale FORM mediante un metodo POST (quindi trasparente all'utente) invierà alla pagina inserisci_appuntamento.asp tutte le informazioni che si trovano dopo di lui.....

Codice: Seleziona tutto

<table width="514" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#999999">
    <tr>
      <td width="514"><div align="center">Anagrafica</div></td>
    </tr>
    <tr>
      <td><table width="514" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC">
          <tr>
            <td>Nome</td>
            <td><div align="right">
                <input name="nome" type="text" id="nome">
              </div></td>
            <td><div align="right">Via</div></td>
            <td><div align="right">
                <input name="via" type="text" id="via">
              </div></td>
          </tr>
          <tr>
            <td>Civico</td>
            <td><div align="right">
                <input name="civico" type="text" id="civico">
              </div></td>
            <td><div align="right">CAP</div></td>
            <td><div align="right">
                <input name="cap" type="text" id="cap">
              </div></td>
          </tr>
          <tr>
            <td>Citt&agrave;</td>
            <td><div align="right">
                <input name="citta" type="text" id="citta">
              </div></td>
            <td><div align="right">Provincia</div></td>
            <td><div align="right">
                <input name="provincia" type="text" id="provincia">
              </div></td>
          </tr>
          <tr>
            <td>Tel Fisso</td>
            <td><div align="right">
                <input name="fisso" type="text" id="fisso">
              </div></td>
            <td><div align="right">Tel Cellulare</div></td>
            <td><div align="right">
                <input name="cellulare" type="text" id="cellulare">
              </div></td>
          </tr>
        </table></td>
    </tr>
  </table>
  <p>&nbsp;</p>

  <table width="514" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#999999">
    <tr>
      <td width="514"><div align="center">Appuntamento</div></td>
    </tr>
    <tr>
      <td><table width="514" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC">
          <tr>
            <td width="256">&nbsp;</td>
            <td width="258">&nbsp;</td>
          </tr>
          <tr>
            <td>Giorno / Mese / Anno</td>
            <td><select name="giorno" size="1" id="giorno">
                <option selected>01</option>
                <option>02</option>
                <option>03</option>
                <option>04</option>
                <option>05</option>
                <option>06</option>
                <option>07</option>
                <option>08</option>
                <option>09</option>
                <option>10</option>
                <option>11</option>
                <option>12</option>
                <option>13</option>
                <option>14</option>
                <option>15</option>
                <option>16</option>
                <option>17</option>
                <option>18</option>
                <option>19</option>
                <option>20</option>
                <option>21</option>
                <option>22</option>
                <option>23</option>
                <option>24</option>
                <option>25</option>
                <option>26</option>
                <option>27</option>
                <option>28</option>
                <option>29</option>
                <option>30</option>
                <option>31</option>
              </select> <select name="mese" size="1" id="mese">
                <option>Gennaio</option>
                <option selected>Febbraio</option>
                <option>Marzo</option>
                <option>Aprile</option>
                <option>Maggio</option>
                <option>Giugno</option>
                <option>Luglio</option>
                <option>Agosto</option>
                <option>Settembre</option>
                <option>Ottobre</option>
                <option>Novembre</option>
                <option>Dicembre</option>
              </select> <select name="anno" id="anno">
                <option>2006</option>
                <option selected>2007</option>
                <option>2008</option>
                <option>2009</option>
                <option>2010</option>
              </select> </td>
          </tr>
          <tr>
            <td>Ora</td>
            <td><select name="ora" id="ora">
                <option selected>08</option>
                <option>09</option>
                <option>10</option>
                <option>11</option>
                <option>12</option>
                <option>13</option>
                <option>14</option>
                <option>15</option>
                <option>16</option>
                <option>17</option>
                <option>18</option>
                <option>19</option>
                <option>20</option>
              </select> <select name="minuti" id="minuti">
                <option selected>00</option>
                <option>15</option>
                <option>30</option>
                <option>45</option>
              </select></td>
          </tr>
        </table></td>
    </tr>
  </table>
  </font>
  <p>&nbsp;</p>
  <table width="514" height="75" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#999999">
    <tr>
      <td width="514"><div align="center">Interesse</div></td>
    </tr>
    <tr>
      <td height="57">
<table width="514" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC">
          <tr>
            <td width="308">A cosa &egrave; interessato il Cliente?</td>
            <td width="206"> <div align="left">
                <select name="interesse" size="1" id="interesse">
                  <option selected>Enciclopedia</option>
                  <option>Sito internet</option>
                  <option>DVD</option>
                  <option>VHS</option>
                </select>
              </div></td>
          </tr>
        </table></td>
    </tr>
  </table>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <table width="514" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#999999">
    <tr>
      <td width="514"><div align="center">Dati di controllo</div></td>
    </tr>
    <tr>
      <td><table width="514" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC">
          <tr>
            <td width="257">&nbsp;</td>
            <td width="257">&nbsp;</td>
          </tr>
          <tr>
            <td>Teleseller</td>
            <td>
              <select name="teleseller" size="1" id="teleseller">
                <option selected>Aragorn</option>
                <option>nemesys_72</option>
                <option>webtemplum</option>
              </select>
            </td>
          </tr>
          <tr>
            <td>Mese appuntamento preso</td>
            <td><select name="mese_preso" size="1" id="mese_preso">
                <option>Gennaio</option>
                <option selected>Febbraio</option>
                <option>Marzo</option>
                <option>Aprile</option>
                <option>Maggio</option>
                <option>Giugno</option>
                <option>Luglio</option>
                <option>Agosto</option>
                <option>Settembre</option>
                <option>Ottobre</option>
                <option>Novembre</option>
                <option>Dicembre</option>
              </select> </td>
          </tr>
        </table></td>
    </tr>
  </table>
  <p>&nbsp;</p>
  <table width="514" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#999999">
    <tr>
      <td width="514"><div align="center"></div></td>
    </tr>
    <tr>
      <td height="24">
        <table width="514" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC">
          <tr>
            <td width="257"><div align="center">



In tutto il pezzo precedente non abbiamo fatto altro che creare e riempire tutte le tabelle, come prima esposto :wink:

Codice: Seleziona tutto

                                <input type="checkbox" name="checkbox" value="checkbox" onclick="abilita(true)">


Con questa riga, con "onclick abilita true" diciamo di abilitare il pulsante INVIA se la casella viene flaggata (vedi script iniziale)

Codice: Seleziona tutto

                     <input type="submit" id="pulsante" disabled="true" name="Submit" value="Invia">
              </div></td>
            <td width="257"><div align="center">
                <input type="reset" name="Submit2" value="Reimposta">
              </div></td>
          </tr>
        </table></td>
    </tr>
  </table>
  </form>
</body>
</html>



E qua chiudiamo la nostra pagina HTML.

Se volete, potete provarla online, vedrete che comunque vi restituirà errore.... manca la pagina "inserisci_appuntamento.asp" che vedremo la prossima volta.


La prossima volta sarà un po' più impegnativa. Creeremo la vera e propria connessione, e faremo vera e propria programmazione..... FINALMENTE, dirà qualcuno! Vedremo finalmente tutto il nostro lavoro all'opera!!! Nell'apposito topic fatemi sapere a che punto siete, così riprendiamo insieme...... Se avete dubbi, esponeteli tranquillamente!

Buona serata!

[tonertemplum]

CAP. 7: L'INSERIMENTO DEI DATI NEL DATABASE

Riprendiamo da dove eravamo rimasti.....

COn la nostra bella paginetta clicckiamo su "invia" e passiamo tutti i dati ad un nuova pagina, che si trova sotto "script_teleseller" e si chiama "inserisci_appuntamento.asp".

Tale pagina si occupa di aprire la connessione al database e di inserire dove noi vogliamo le informazioni raccolte. Andiamo subito a vedere come è fatto il codice asp e commentiamolo insieme

Codice: Seleziona tutto

<html>
<head>
<title>Salvataggio dell'appuntamento in corso...</title>
<style type="text/css">
<!--
@import url("../css/testo.css");
-->
</style>
</head>
<body>
<p>


Fino a qui è l'apertura classica di una pagina HTML, con le dichiarazioni del titolo, il collegamento a un css.....

Codice: Seleziona tutto

  <%
nomeoriginale = Request.Form("nome")
nome = Replace(nomeoriginale,"'","''")


E qua comincia la programmazione vera e propria, il vero e proprio ASP.

Abbiamo la prima istruzione da imparare: Request.form("nome")

A cosa serve? Nella precedente pagina avevamo la casella di testo chiamata "nome" in cui inserivamo il nome del probabile Cliente..... bene, questa istruzione richiede (request) al form (ed ecco il perchè nell'altra pagina abbiamo usato un form) il valore "nome" e lo memorizza nella variabile "nomeoriginale". Da notare anche che usiamo anche un'altra istruzione: usiamo una variabile "nome" che è composta da una modifica (replace) della variabile appena presa "nomeoriginale". Questo perchè? Perchè nel caso il Cliente si chiami Alessandro Webtemplum non avremmo alcun tipo di problema, ma nel caso il nome inserito sia un "D'aquilani Sergio" allora l'apostrofo tra d e aquilani interferirebbe con la istruzione SQL (che vedremo tra poco) e causerebbe errore.....

Nelle prossime Request.Form vedrete abbiamo usato sempre il Replace (tranne nei valori fissi come il giorno, il mese, l'anno etc etc che siamo sicuri di come sono scritti....

Codice: Seleziona tutto

viaoriginale=request.Form("via")
via = Replace(viaoriginale,"'","''")

civico=request.Form("civico")

cap=request.Form("cap")

cittaoriginale=request.Form("citta")
citta = Replace(cittaoriginale,"'","''")

provincia=request.Form("provincia")

fisso=request.Form("fisso")

cellulare=request.Form("cellulare")

giorno=request.Form("giorno")

mese=request.Form("mese")

anno=request.Form("anno")

ora=request.Form("ora")

minuti=request.Form("minuti")

interesse=request.Form("interesse")

teleseller=request.Form("teleseller")

mese_preso=request.Form("mese_preso")


Per il blocco precedente vale quanto appena detto per "nomeoriginale=Request.form("Nome") poco + su......

Codice: Seleziona tutto

Set cn = Server.CreateObject("ADODB.Connection")
Set rs = Server.CreateObject("ADODB.Recordset")
cn.Open "driver={Microsoft Access Driver (*.mdb)};dbq="&Server.MapPath("/db/appuntamenti.mdb")


E qua arriva il bello: creiamo due variabili, CN e RS (connection e Recordset) che ci permettono di collegari al Database Access (questa frase è "standard ;) ) quindi apriamo (cn.Open) utilizzando il driver di Access (*.mdb) il database che si trova in /db/appuntamenti.mdb.

Ripeto, è una frase praticamente standard, ne esistono anche altre; l'unica cosa da modificare è il path (percorso) sul server del vostro database..... finalmente ci siamo arrivati al Database!!!!! :rido:

Codice: Seleziona tutto

SQL = "insert into appuntamenti (nome, via, civico, cap, citta, provincia, fisso, cellulare, giorno, mese, anno, ora, minuti, interesse, teleseller, mese_preso)"
SQL = SQL & "values ('" & nome
SQL = SQL & "','" & via
SQL = SQL & "','" & civico
SQL = SQL & "','" & cap
SQL = SQL & "','" & citta
SQL = SQL & "','" & provincia
SQL = SQL & "','" & fisso
SQL = SQL & "','" & cellulare
SQL = SQL & "','" & giorno
SQL = SQL & "','" & mese
SQL = SQL & "','" & anno
SQL = SQL & "','" & ora
SQL = SQL & "','" & minuti
SQL = SQL & "','" & interesse
SQL = SQL & "','" & teleseller
SQL = SQL & "','" & mese_preso  & "')"


QUa abbiamo usato la prima delle istruzioni SQL che vedremo.... la INSERT.
Con questa istruzione inseriamo (INSERT) dentro la tabella APPUNTAMENTI (nelle colonne nome, via, civico.......) i valori (VALUES) presi con i Request.Form di prima e quindi nome, via, civico, cap, citta.......

Ho usato una notazione in verticale perchè diventa più comodo da vedere e da ricontrollare....

Codice: Seleziona tutto

rs.Open sql, cn
%>


COn la precedente istruzione, sempre standard, apriamo il record e inseriamo tutti i valori presi con la istruzione SQL.... infine chiudiamo il codice del programma con il %>.

Codice: Seleziona tutto

</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><font face = "arial"> </font> </p>
<table width="730" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td><div align="center"><a href="../inserisci2.asp" class="testo">L'appuntamento
        &egrave; stato salvato correttamente, clicca qui per inserirne uno nuovo</a></div></td>
  </tr>
</table>

</body>
</html>


Quest'ultimo pezzo è l'unica cosa che effettivamente vediamo... Appare una scritta (se tutto è andato ok) che ci informa che l'appuntamento è stato salvato e cliccandoci ci rimanda alla maschera di inserimento....

Abbiamo inserito i nostri primi dati del database, la prossima volta andiamo a crearci una pagina per vedere tutto quello che abbiamo inserito...

[tonertemplum]

CAP. 8: VISUALIZZARE TUTTI I DATI NEL DATABASE (E IL LORO DETTAGLIO)

Abbiamo inserito i nostri appuntamenti, ora creiamoci due paginette... una per vedere un riepilogo di tutti gli appuntamenti inseriti e una per vederne il loro relativo dettaglio, magari per stamparli

Per mia comodità, l'ho messa dentro una cartella chiamata "amministrazione"... vediamo subito il codice. Premetto, ho creato una tabella con pochi campi (nome, data, ora, commerciale, teleseller). Ecco qui il codice di "visualizza_tutti.asp" - da ora commenterò solo le parti "nuove"

Codice: Seleziona tutto

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>..:: Area TLM ::..</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="../css/dettaglio.css" rel="stylesheet" type="text/css">
<link href="../css/intestazione_tabelle.css" rel="stylesheet" type="text/css">
</head>

<body>
<table width="526" height="99" border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td height="99">
      <div align="center"><img src="../images/top.png" width="526" height="99"></div></td>
  </tr>
</table>
<%
Set cn = Server.CreateObject("ADODB.Connection")
Set rs = Server.CreateObject("ADODB.Recordset")
cn.Open "driver={Microsoft Access Driver (*.mdb)};dbq="&Server.MapPath("/db/appuntamenti.mdb")


Fino a qui abbiamo praticamente visto nella lezione precedente, compresa la dichiarazione della connessione al DB e il recordset (occhio al percorso del database!!!)

Codice: Seleziona tutto

sql = "select * from appuntamenti ORDER BY ID"


Con la SQL precedente abbiamo selezionato (SELECT) tutto (*) dalla tabella APPUNTAMENTI e li abbiamo anche ordinati (ORDER BY) per ID...

Codice: Seleziona tutto

rs.Open sql, cn
%>
  </font>
  <div align="left">
   
  <table width="721" BORDER="1" align="center" CELLSPACING="0" BGCOLOR="#FFFFFF" class="dettaglio">
    <THEAD>
      <tr align="center" valign="middle" class="intesttabelle">
        <th width="127">
          <div align="center">Nome</div></th>
        <th width="122">
          <div align="center">Interesse</div></th>
        <th width="73">
          <div align="center">Giorno</div></th>
        <th width="67">
          <div align="center">Mese</div></th>
        <th width="55">
          <div align="center">Ora</div></th>
        <th width="51">
          <div align="center">Minuti</div></th>
        <th width="109">
          <div align="center">Commerciale</div></th>
        <th width="83">
          <div align="center">Teleseller</div></th>
        <th width="83">
          <div align="center">ID</div></th>
      </tr>
    </THEAD>
    <TBODY>


Nulla di nuovo nel blocco precendete.....

Codice: Seleziona tutto

      <%
On Error Resume Next
rs.MoveFirst
do while Not rs.eof
%>


Con il codice precedente gli abbiamo detto di andare al primo record e di prenderli tutti finchè (WHILE NOT) il recordset non è alla fine (EOF)

Codice: Seleziona tutto

      <tr align="center" VALIGN="middle" class="dettaglio">
        <td height="22">
          <div align="center"><a href='dettaglio.asp?id=<%= rs("id")%>'><%= rs("nome") %></a></div></td>
        <td>


Il codice precedente è un po' ostico... attenzione:
partiamo dalla fine e lo ripetiamo....

Codice: Seleziona tutto

<a href='dettaglio.asp?id=<%= rs("id")%>'><%= rs("nome") %></a>


con

Codice: Seleziona tutto

<%=rs("nome")%>

abbiamo richiamato dal recordset il valore nel campo "nome", e lo linkiamo alla pagina "dettaglio.asp" (

Codice: Seleziona tutto

<a href='dettaglio.asp

) in cui l'id

Codice: Seleziona tutto

    ?id=   

è uguale al recordset dell'ID preso per quella riga specifica (

Codice: Seleziona tutto

   <%= rs("id")%>   

), come abbiamo fatto praticamente per far visualizzare il nome con

Codice: Seleziona tutto

<%=rs("nome")%>

.

Codice: Seleziona tutto

          <div align="center"><%= rs("interesse") %></div></td>
        <td>
          <div align="center"><%= rs("giorno") %></div></td>
        <td>
          <div align="center"><%= rs("mese") %></div></td>
        <td>
          <div align="center"><%= rs("ora") %></div></td>
        <td>
          <div align="center"><%= rs("minuti") %></div></td>
        <td>
          <div align="center"><%= rs("commerciale") %></div></td>
        <td>
          <div align="center"><%= rs("teleseller") %></div></td>
        <td>
          <div align="center"><%= rs("ID") %></div></td>
      </tr>


Codice: Seleziona tutto

      <%
rs.MoveNext
loop%>


finchè non finiscono i campi vai al prossimo e scrivilo, in loop (letteralmente, giro, ripetersi)

Codice: Seleziona tutto

    </TBODY>
    <TFOOT>
    </TFOOT>
  </table>
</div>
</body>
</html>


e qui chiudiamo la nostra pagina di visualizzazione (generica); nel prossimo capitolo vedremo la pagina "dettaglio.asp" che ci permette, come dice il nome, di vedere il dettaglio dell'appuntamento....


Con i prossimi capitoli andremo a manipolare i dati già inseriti: quindi assegneremo un appuntamento a un commerciale, cancelleremo un appuntamento che non serve +, andremo a conteggiare gli appuntamenti presi dalla teleseller in un dato mese per poi poterle calcolare lo stipendio provvigionale..... ma tranquilli, d'ora in avanti è tutta discesa!

Buona serata!

Alessandro

[tonertemplum]

CAP. 9: LA PAGINA "DETTAGLIO.ASP"

Ormai siete bravissimi ad aprire una connessione e inserire i dati e richiamarli, andremo un poco + veloci su questa pagina, che non ha nulla di nuovo.....

Codice: Seleziona tutto

<html>
<head>
<title>Dettaglio Appuntamento</title>
<style type="text/css">
<!--
@import url("../css/testo.css");
-->
</style>
<link href="../css/dettaglio.css" rel="stylesheet" type="text/css">
<style type="text/css">
<!--
@import url("../css/intestazione_tabelle.css");
-->
</style>
</head>
<body><div align="left">
<p><font face = "arial" size="1">
  <p>


Codice: Seleziona tutto

<%
dim id
id = Request.QueryString("id")
Set cn = Server.CreateObject("ADODB.Connection")
Set rs = Server.CreateObject("ADODB.Recordset")
cn.Open "driver={Microsoft Access Driver (*.mdb)};dbq="&Server.MapPath("/db/appuntamenti.mdb")

sql = " select * from appuntamenti WHERE ID =  "&ID&" "

rs.Open sql, cn
%>
<%
On Error Resume Next
rs.MoveFirst
do while Not rs.eof
%>


Abbiamo preso una variabile ID, richiesta (Request.QueryString) alla pagina che l'ha passata (vi ricordate nella lezione precedente? ) e ce la usiamo nella nostra query SQL:

Selezionamo tutto (SELECT *) dalla tabella appunamenti (FROM APPUNTAMENTI) dove l'ID è uguale all'ID che ci ha passato l'altra pagina (WHERE ID ="&ID&").... e qui diventa tutto molto chiaro, sopratutto quando all'inizio vi ho detto che l'ID come chiave primaria era un campo importantissimo e che sarebbe stato quello che, essendo univoco, ci avrebbe permesso di lavorare su tutto........

Codice: Seleziona tutto

</p>
<table width="650" border="1" align="center" cellpadding="0" cellspacing="0">
  <tr class="intesttabelle">
    <td width="220">
      <div align="center">Nome</div></td>
    <td width="199">
      <div align="center">Telefono Fisso</div></td>
    <td width="223">
      <div align="center">Cellulare</div></td>
  </tr>
  <tr class="dettaglio">
    <td>
      <div align="center"><%= rs("nome") %></div></td>
    <td>
      <div align="center"><%= rs("fisso") %></div></td>
    <td>
      <div align="center"><%= rs("cellulare") %></div></td>
  </tr>
</table>
<p class="dettaglio">&nbsp;</p>
<p>&nbsp;</p>
<table width="650" border="1" align="center" cellpadding="0" cellspacing="0">
  <tr class="intesttabelle">
    <td width="289">
      <div align="center">Via</div></td>
    <td width="105">
      <div align="center">Civico</div></td>
    <td width="96">
      <div align="center">Citt&agrave;</div></td>
    <td width="67">
      <div align="center">Provincia</div></td>
    <td width="81">
      <div align="center">CAP</div></td>
  </tr>
  <tr class="dettaglio">
    <td>
      <div align="center"><%= rs("via") %></div></td>
    <td>
      <div align="center"><%= rs("civico") %></div></td>
    <td>
      <div align="center"><%= rs("citta") %></div></td>
    <td>
      <div align="center"><%= rs("provincia") %></div></td>
    <td>
      <div align="center"><%= rs("cap") %></div></td>
  </tr>
</table>
<p>&nbsp;</p>
<table width="650" border="1" align="center" cellpadding="0" cellspacing="0">
  <tr class="dettaglio">
    <td width="102">
      <div align="center"><%= rs("giorno") %></div></td>
    <td width="158">
      <div align="center"><%= rs("mese") %></div></td>
    <td width="128">
      <div align="center"><%= rs("anno") %></div></td>
    <td width="129">
      <div align="center"><%= rs("ora") %></div></td>
    <td width="121">
      <div align="center"><%= rs("minuti") %></div></td>
  </tr>
</table>
<p>&nbsp;</p>
<table width="293" border="1" align="center" cellpadding="0" cellspacing="0">
  <tr class="testo">
    <td width="289"> <div align="center" class="intesttabelle">Interesse</div></td>
  </tr>
  <tr class="testo">
    <td><div align="center" class="dettaglio"><%= rs("interesse") %></div></td>
  </tr>
</table>
<p>&nbsp;</p>
<table width="293" border="1" align="center" cellpadding="0" cellspacing="0">
  <tr class="dettaglio">
    <td width="143">
      <div align="center">Commerciale</div></td>
    <td width="144">
      <div align="center">Teleseller</div></td>
  </tr>
  <tr class="testo">
    <td><div align="center"><%= rs("commerciale") %></div></td>
    <td><div align="center"><%= rs("teleseller") %></div></td>
  </tr>
        <%
rs.MoveNext
loop%>
</table>
</body>
</html>


Nei campi della tabella con il codice precedente ci siamo presi solo i valori che corrispondono a un determinato ID e li abbiamo tutti mostrati..... FINITO! Anche con solo questa parte siamo in grado di costruire un nostro sito dinamico... dinamico perchè le pagine non saranno mai uguali una con l'altra per i valori immessi

Le prossime volte invece lavoreremo sui nostri dati GIA' inseriti... nulla di più semplice, una volta capiti questi meccanismi... basterà usare la query SQL opportuna e richiamare correttamente i dati....

Alla prossima!