Esercizio 1.5: Creazione di una pagina di aggiornamento

Prima di iniziare, è necessario completare l'Esercizio 1.4: Creazione di nuovi record.

Sono state create pagine per visualizzare e creare voci di elenco per il sito Web. In questo esercizio, verrà creata una pagina che consente agli utenti di aggiornare ed eliminare voci di elenco. La pagina di aggiornamento sarà uguale a quella di creazione, con una sola eccezione: in questa pagina i campi di input visualizzeranno i dati da un record esistente che l'utente può modificare.

Come prima cosa, verrà creato un record relazionale, che rappresenta un record esistente nel database. Successivamente, verrà creato un modulo di aggiornamento JavaServer Faces per questo record relazionale e dopo aver apportato piccole modifiche, la pagina sarà pronta per la verifica.

Creazione del record relazionale di aggiornamento

Mostra
  1. In Esplora progetti, aprire il file update_record.jsp facendo doppio clic su di esso.
  2. Eliminare il testo predefinito Place content here.
  3. Nella vista Tavolozza, fare clic sul cassetto Dati per espanderlo.
  4. Trascinare il componente Record relazionale dalla Tavolozza nell'area di contenuto vuota. Si apre la finestra Aggiunta record relazionale.
  5. Nel campo Nome, immettere update_record.
  6. Sotto Crea controlli per, fare clic su Aggiornamento record esistente.
  7. Assicurarsi che l'opzione Aggiungi controlli input/output per visualizzare il record relazionale nella pagina Web sia selezionata.
  8. Fare clic su Avanti.
  9. Nella casella Tabella, fare clic sulla tabella W5SAMPLE.ADS.
  10. Fare clic su Avanti. Si apre la pagina Selezione colonne e altre attività.

Filtraggio dei risultati

Mostra

Un record relazionale può visualizzare solo un record del database. Pertanto, è necessario filtrare la tabella del database in modo che venga visualizzato solo un record (non è stato necessario applicare un filtro al database nel precedente esercizio, in quanto è stato creato un nuovo record e, quindi, non vi erano risultati del database da filtrare.) Dal momento che ciascun record del database presenta un numero ID univoco, i risultati verranno filtrati perché venga restituito un record con un determinato numero ID.

  1. In Attività, fare clic su Filtra risultati. Si apre la finestra Filtri e viene inserita la condizione del filtro predefinita ID = #{param.ID} nella colonna Filtro.

    La finestra Filtri è simile a quella riportata nella seguente immagine:

    Finestra Filtri

    Questo codice filtra i record nel database in modo che nel record relazionale compaia solo il record con il numero ID specificato. Maggiori informazioni su questa condizione verranno fornite nella sezione Inserimento di un collegamento ipertestuale, più avanti nel corso di questo esercizio.

  2. Fare clic su Chiudi.
  3. Fare clic su Avanti. Si apre la pagina Configurazione controlli per dati.
  4. Nella sezione Campi da visualizzare, deselezionare la casella di controllo accanto al nome di ogni campo, fatta eccezione per quelli che si desidera inserire nel modulo di input:
  5. Facendo clic su Su o Giù, riordinare i nomi dei campi dall'alto verso il basso, nel modo seguente:
    1. ID
    2. TITLE
    3. DESCRIPTION
    4. MAINCATEGORY
    5. PRICE
    6. PHONE
  6. Per il campo ID, selezionare Campo di output dall'elenco a discesa nella colonna Tipo di controllo.

    Anche se si desidera permettere agli utenti di visualizzare il numero ID di un record, è necessario fare in modo che non lo aggiornino. Trasformando il campo ID in un campo di output, è possibile impedire che gli ID vengano duplicati.

  7. Fare clic su Opzioni. Si apre la finestra Opzioni.
  8. Assicurarsi che l'opzione relativa al pulsante di inoltro sia selezionata.
  9. Immettere Update nel campo Etichetta.
  10. Fare clic su OK.
  11. La finestra Aggiunta record relazionale dovrebbe essere simile a quella riportata nella seguente immagine:

    Finestra Aggiunta record relazionale

  12. Fare clic su Fine per generare il modulo di aggiornamento nella pagina, come illustrato nella seguente figura:

    Aspetto corrente della pagina

Programmazione del pulsante Update

Mostra

Di nuovo verrà aggiunto codice per indirizzare l'utente alla pagina all_records.jsp per visualizzare il record modificato insieme a tutti gli altri record.

  1. Fare clic sul pulsante Update appena creato nella pagina Web.
  2. Aprire la vista Modifica rapida.
  3. Nella vista Modifica rapida, fare clic per posizionare il cursore immediatamente prima di return "";
  4. Premere Invio. Viene visualizzata una nuova riga prima di return "";
  5. Fare clic con il tasto destro del mouse sulla riga vuota, quindi scegliere Inserisci frammento > Vai alla pagina dal menu di scelta rapida. Si apre la finestra Modifica azione GotoPage.
  6. Dall'elenco a discesa, selezionare all_records.jsp come pagina di destinazione.
  7. Fare clic su OK.
  8. Il codice dell'evento per il pulsante dovrebbe essere simile al codice riportato nella seguente immagine:

    Esempio di codice

    Dopo che l'utente ha aggiornato un record, la pagina indirizzerà il browser alla pagina all_records.jsp per controllare che il record sia stato aggiornato. Il pulsante delete dovrebbe indirizzare l'utente di nuovo alla pagina all_records.jsp.

  9. Ripetere i passi 1-7 per modificare il codice allo stesso modo per il pulsante Delete nella pagina Web.
  10. Salvare la pagina.

Inserimento di un collegamento ipertestuale

Mostra

A questo punto, occorre creare collegamenti nella pagina all_records.jsp per consentire all'utente di selezionare un record del database da aggiornare. #{param.ID} rappresenta il numero ID del record che la pagina di aggiornamento aggiornerà. Quando l'utente fa clic sul collegamento di un record, il numero ID del record verrà inviato alla pagina update_record.jsp come parametro #{param.ID}. Quindi, il record relazionale filtrato appena inserito nella pagina update_record.jsp visualizzerà solo il record da aggiornare.

  1. Nella vista Esplora progetti, fare doppio clic sul file all_records.jsp per aprirlo.
  2. Fare clic in un punto qualsiasi all'interno della tabella dati.
  3. Aprire la vista Proprietà.
  4. Nella vista Proprietà, fare clic su h:dataTable dall'elenco dei tag HTML sulla sinistra della vista.
  5. All'estrema destra della vista Proprietà, fare clic su Aggiungi per aggiungere una nuova colonna.
  6. Immettere Update nel campo Etichetta della nuova colonna e premere Invio. Una colonna chiamata Update viene generata nella tabella dati.
  7. Con la nuova colonna selezionata nella vista Proprietà, fare clic su Sposta giù fino a posizionare la colonna Update all'estrema destra della tabella dati.
  8. Nella vista Tavolozza, fare clic sul cassetto Componenti Faces per espanderlo.
  9. Trascinare un componente Collegamento dalla Tavolozza nella colonna appena creata. Si apre la finestra Configurazione URL.
  10. Nel campo URL, immettere update_record.jsp come collegamento di destinazione e immettere Update Listing nel campo Etichette.
  11. Fare clic su OK. Il collegamento ipertestuale Update Listing viene visualizzato nella colonna Update.
  12. Fare clic sull'icona del collegamento Icona Collegamento accanto al collegamento ipertestuale Update Listing nella colonna Update.
  13. Nella vista Proprietà, fare clic sulla scheda Parametro che si trova immediatamente sotto il tag hx:outputLinkEx sul lato sinistro della vista.
  14. Fare clic sul Aggiungi parametro, quindi immettere ID nel campo Nome.

    Occorre associare il parametro ID alla colonna ID nel modulo di input. Eseguire il binding del parametro del collegamento ipertestuale alla colonna ID dell'elenco dati significa che quando si fa clic sul collegamento ipertestuale, il parametro di richiesta sarà l'ID del record nell'elenco.

  15. Selezionare il campo Valore, quindi fare clic sul pulsante Seleziona oggetto dati pagina nel campo. Si apre la finestra Selezione oggetto dati pagina.
  16. Nel campo Oggetto dati, fare clic sulla colonna ID dall'elenco di record all_recordlist(ADS), come mostrato nella seguente figura:

    Finestra Selezione oggetto dati pagina

  17. Fare clic su OK.

    Quando l'utente farà clic sul collegamento Update Listing, il sito Web consentirà all'utente di aggiornare le informazioni relativa all'annuncio economico.

  18. Salvare il file e, se si desidera, eseguire una verifica della pagina. Ricordare di aprire prima all_records.jsp, in quanto questa è la pagina che si collega a update_record.jsp.

In questo esercizio è stato illustrato come creare pagine Web che aggiornano i record di un database. A questo punto, è possibile iniziare l'Esercizio 1.6: Filtraggio di un elenco record relazionali

Feedback
(C) Copyright IBM Corporation 2000, 2005. Tutti i diritti riservati.