Nella generazione della lista dei libri, solo per un utente amministratore, viene visualizzata una icona per l'eliminazione del libro: la vista listilibri.jade contiene il seguente codice
block contenuti-principali
if (libri.length > 0)
table(class='table table-striped table-bordered')
thead
tr
th Codice
th Titolo
th Autore
if (session.utente.profilo === 'admin')
th Elimina
each libro in libri
tr
td #{libro.codiceisbn}
td #{libro.titolo}
td #{libro.autore}
if (session.utente.profilo === 'admin')
td
a(href='/libri/elimina/#{libro.codiceisbn}')
img(src='/imgs/delete.png')
else
div.conmarginesuperiore
ul
li.text-info Non ci sono libri in Biblioteca
Notate l'espressione condizionale per l'aggiunta di una ulteriore intestazione e colonna all'interno della tabella.Il link per l'eliminazione racchiude l'informazione del codice isbn del libro da eliminare, nel caso del signore degli anelli, ad esempio, verrà generato questo link /libri/elimina/DRF00223Z: l'ultima parte dell'indirizzo rappresenta un parametro di richiesta che potremo estrarre facilmente nel codice di gestione della richiesta.
Al file libri.js abbiamo aggiunto il codice seguente
router.route('/elimina/:codiceisbn')
.get(function(request,response){
serviziLibri.elimina(request.params.codiceisbn);
response.redirect('/libri');
});
l'ultima parte dell'indirizzo della richiesta, viene automaticamente estratto e memorizzato come un parametro in request.params.codiceisbn, dopo aver effettuato l'eliminazione viene eseguita una nuova richiesta all'indirizzo /libri che riscatenerà la creazione della lista dei libri aggiornata.Abbiamo aggiunto la funzionalità di eliminazione all'interno del file dei servizi per i libri
....
var elimina = function(codiceisbn) {
libri = libri.filter(function(libro) {
return libro.codiceisbn != codiceisbn;
});
};
....
return {
listaLibri : listaLibri,
elimina: elimina,
salvaLibro: salvaLibro
};
...
La funzionalità di creazione nuovo libro è identica a quella di registrazione.Partiamo del form definito in nuovolibro.jade
block testata
h1.text-info Nuovo Libro
block contenuti-principali
form(method='post', action='nuovo')
div.form-group
label(for='codiceisbn') Codice Isbn
input(type='text', class='form-control' name='codiceisbn', placeholder='Isbn')
div.form-group
label(for='titolo') Titolo
input(type='text', class='form-control' name='titolo', placeholder='Titolo')
div.form-group
label(for='autore') Autore
input(type='text', class='form-control' name='autore', placeholder='Autore')
button(type='submit' class='btn btn-default') Salva!
Al submit del form viene effettuata la richiesta di tipo POST all'indirizzo /libri/nuovo, richiesta gestita in questo modo
...
var validatoreNuovoLibro = form(
field('codiceisbn').trim().required('', 'Inserire il codice isbn!'),
field('titolo').trim().required('','Inserire Il titolo!'),
field('autore').trim().required('','Inserire autore!')
);
...
router.route('/nuovo')
.get(function(request,response) {
response.render('nuovolibro');
})
.post(validatoreNuovoLibro,function(request,response) {
var messages;
var libro = {};
if (!request.form.isValid) {
messages = request.form.errors;
}
else {
libro.codiceisbn = request.body.codiceisbn;
libro.titolo = request.body.titolo;
libro.autore = request.body.autore;
serviziLibri.salvaLibro(libro);
messages = ['Libro memorizzato con successo'];
}
response.render('nuovolibro', {messages: messages});
});
I parametri sono memorizzati nel corpo della richiesta http in request.body e sono validati da validatoreNuovoLibroAbbiamo aggiunto una nuova funzionalità al file serviziLibri.js
...
var salvaLibro = function(libro) {
libri.push(libro);
};
return {
listaLibri : listaLibri,
elimina: elimina,
salvaLibro: salvaLibro
};
...
Risultato finale: https://whispering-peak-1284.herokuapp.com/
Ho aggiornato su github il progetto installato su heroku, in modo che possiate avere tutto il codice a disposizione, in questo post è spiegato come utilizzare github.
Dopo aver fatto il pull del progetto, ricordatevi di eseguire npm install (se non lo avete mai fatto) nella cartella di progetto per installare le dipendenze aggiuntive: se volete eseguire il programma in locale digitate node app.js e puntate il browser all'indirizzo http://localhost:5000.
Alla prox
Ivan
Nessun commento:
Posta un commento