< Indietro | Avanti >

Lezione 5: Creazione di una pagina Web

In questa lezione, verrà creata una pagina Web con il formato file Faces JSP. Nella lezione successiva, si aggiungeranno dati a questa pagina utilizzando le parti dati e le funzioni create nella lezione precedente. La pagina terminata mostrerà un elenco di ogni record nel database.
Questa esercitazione utilizza la tecnologia JavaServer Faces (JSF). JSF propone un framework per lo sviluppo di interfacce utente per le applicazioni Web. Le pagine Web in JSF sono JavaServer pages (JSP). Le JSP contengono controlli JavaServer che è possibile utilizzare per integrare il codice Java nella pagina, fornendo contenuto dinamico.

Creazione del file JSP da un template

  1. Nella vista Esplora enterprise, fare clic con il tasto destro del mouse sulla cartella WebContent nel progetto EGLWeb, quindi fare clic su Nuovo > Pagina Web. È importante selezionare l'ubicazione in cui si desidera salvare i nuovi file; in caso contrario i file potrebbero apparire in una ubicazione diversa da quella prevista. Viene aperta la finestra Nuova pagina Web.
  2. Nel campo Nome file, immettere il nome file seguente, inclusa l'estensione:
    allcustomers.jsp
  3. Assicurarsi che il campo Cartella contenga la cartella /EGLWeb/WebContent.
  4. Nell'elenco Modello, espandere Modello di esempio e fare clic su Famiglia A (senza navigazione). Nella casella Anteprima vengono visualizzati i template della pagina Web semplici appartenenti a questa categoria.
  5. Nella casella Anteprima, fare clic sul modello A_gray.htpl.
  6. Assicurarsi che la casella di spunta Collega la pagina al template sia selezionata.

    La finestra Nuova pagina Web risulterà simile alla seguente immagine:

    Schermata Nuovo file Faces JSP

  7. Fare clic su Fine. Il nuovo file Faces JSP viene aperto nell'editor.
  8. Fare clic su Progettazione per visualizzare la vista di progettazione nella finestra dell'editor a dimensione completa. Nella parte destra della finestra dell'editor, potrebbe essere visualizzata la vista Traccia JSF. Eclipse crea tale vista per impostazione predefinita, condividendo lo spazio con la vista Tavolozza ed altre. Per questa esercitazione, la vista Traccia JSF non è necessaria. È possibile chiuderla facendo clic sulla X nella scheda.
    La vista Traccia JSF potrebbe mostrare un triangolo di avvertenza giallo.
    Generalmente, la Tavolozza viene visualizzata in questa vista. Potrebbe essere necessario fare clic sulla doppia freccia e selezionare la vista Tavolozza da un menu:
    Selezione della vista Tavolozza.
  9. Nel nuovo file allcustomers.jsp, rimuovere il testo predefinito "Inserire il contenuto della pagina qui" e sostituirlo con il testo riportato di seguito:
    List of all customers
  10. Premere Invio tre volte per inserire righe vuote. Queste righe lasciano uno spazio in cui sarà possibile aggiungere contenuto a questa pagina durante lo svolgimento della lezione successiva.

    La pagina risulterà simile alla seguente immagine:

    Aspetto della pagina

  11. Salvare il file.

Anteprima della pagina Web sul server

La pagina Web non contiene ancora i dati provenienti dal database, ma è possibile eseguire il file JSP sull'application server Web e vedere l'aspetto che ha adesso la pagina. Questa è una operazione importante; ci si assicura che l'application server funzioni correttamente prima che la pagina si complichi.
  1. Assicurarsi che l'application server sia avviato. Il nome del server dovrebbe essere visibile nella vista Server (ubicata per impostazione predefinita nella vista Editor). Sul server dovrebbero essere visualizzate le parole Avviato e Sincronizzato tra parentesi dopo il nome. Un caso contrario, fare clic con il tasto destro del mouse sul nome del server, quindi fare clic su Avvia. Questo processo potrebbe richiedere alcuni minuti.
    WebSphere Application Server avviato e sincronizzato
  2. Nella vista Esplora enterprise, espandere la cartella EGLWeb/WebContent, se necessario. Fare clic con il tasto destro del mouse sul file allcustomers.jsp e fare clic su Esegui come > Esegui su server. Viene aperta la finestra Definizione di un nuovo server.
  3. Nella finestra Definizione di un nuovo server, selezionare il proprio server.
  4. Selezionare la casella di spunta Utilizza sempre questo server per l'esecuzione di questo progetto.
    Il server è selezionato.
  5. Fare clic su Fine.

La pagina Web viene aperta in un browser Web nel workbench. La pagina risulterà simile alla seguente immagine:

Aspetto della pagina nel browser Web interno

Se viene visualizzato il messaggio di errore HTTP 404 (pagina non trovata), riavviare il server ed aggiornare la finestra del browser.

Se si preferisce utilizzare un browser Web esterno, è possibile copiare l'URL dal browser Web nel workbench ed incollarlo nel campo dell'indirizzo del browser esterno.

Eclipse può visualizzare nuovamente la vista Traccia JSF. È possibile rimuovere la vista in modo permanente scorrendo verso il basso fino a quando non viene visualizzato il collegamento Non aprire nuovamente e non si fa clic su tale collegamento.
Opzioni per la gestione della vista Traccia JSF.

Per il momento la pagina non contiene dati. Nella lezione successiva si aggiungeranno i dati alla pagina utilizzando EGL.

< Indietro | Avanti >

Feedback