HTML. Usare il seguente HTML per i primi tre esercizi (che, si noti, al momento restituisce un errore JavaScript):

Dimensione: px

Iniziare la visualizzazioe della pagina:

Download "HTML. Usare il seguente HTML per i primi tre esercizi (che, si noti, al momento restituisce un errore JavaScript):"

Filippa Capone
8 anni fa
Visualizzazioni

1 HTML Usare il seguente HTML per i primi tre esercizi (che, si noti, al momento restituisce un errore JavaScript): <!DOCTYPE html> <html> <head> <title>prove Javascript</title> <script type="text/javascript"> </script> </head> <body> <h1>prove Javascript</h1> <p id="para1">un paragrafo di prova.</p> <button type="button" onclick="funzione()">clicca qui</button> </body> </html>

DOCTYPE html> <html> <head> <title>prove Javascript</title> <script type="text/javascript">

2 Esercizio 1 Utilizzando il documento HTML specificato sopra, e senza usare jquery, fare in modo che, facendo click sul pulsante Clicca qui, compaia una finestra di alert con scritto Hello World.

3 Esercizio 2 Utilizzando il documento HTML specificato sopra, e senza usare jquery, fare in modo che, facendo click sul pulsante Clicca qui, si chieda all utente di specificare una stringa (si guardi la funzione prompt() ), e si cambi il contenuto del paragrafo para1 con la stringa composta da Tu hai scritto che e quanto fornito dall utente. Si guardino al proposito le proprietà getelementbyid dell oggetto document e innerhtml dell oggetto Node.

), e si cambi il contenuto del paragrafo para1 con la stringa composta da Tu hai scritto che e quanto fornito

4 Esercizio 3 Utilizzando il documento HTML specificato sopra, e senza usare jquery, si aggiungano due campi numerici e si faccia in modo che, facendo click sul pulsante Clicca qui, si raccolgano i valori dei due campi (proprietà value dell oggetto Node), li si sommi e si metta il risultato nel paragrafo para1. A tal proposito può essere utile la funzione parseint.

qui, si raccolgano i valori dei due campi (proprietà value dell oggetto Node), li si sommi

5 Esercizio 4 Si scarichi sul proprio spazio web il documento JSON disponibile all indirizzo Utilizzando il documento HTML specificato sopra, e usando jquery, si carichi via Ajax la propria copia del file JSON e se ne visualizzi il contenuto sotto forma tabellare nel div di un documento HTML (si può usare Bootstrap). Facoltativo: si utilizzi un widget di data grid come per ottenere una visualizzazione sofisticata della tabella con filtri, ordinamenti e flessibilità nella strutturazione delle colonne.

contenuto sotto forma tabellare nel div di un documento HTML (si può usare Bootstrap).

6 Esercizio 5 Creare un costruttore per oggetti Automobile che ha come parametri un modello (una stringa), una fotografia (un URL) e un prezzo (un numero). Automobile ha anche una proprietà leggibile e scrivibile, inizialmente vuota: il codice (una stringa). L oggetto mette a disposizione un metodo: mostra(), che restituisce un frammento HTML che espone le proprietà dell automobile. Creare con Bootstrap 1 una semplice struttura HTML a due colonne, che comprenda nella colonna a sinistra i seguenti bottoni: Crea automobile, che mostra un modale Ok/Cancella che contiene un form con campi per modello, url della fotografia e prezzo giornaliero, e in seguito all Ok crei un istanza di Automobile e venga aggiunto ad un array globale automobili. Mostra Stato, che cancella un apposito div della colonna di destra e vi pone lo stato attuale dell array automobili chiamando il metodo mostra() di ciascun elemento e mettendo dentro al div suddetto i frammenti HTML corrispondenti. 1 Si aggiunga il seguente codice a <head> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css "> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></s cript> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js">< /script>

L oggetto mette a disposizione un metodo: mostra(), che restituisce un frammento HTML che espone le proprietà dell automobile.

7 Esercizio 6 Sulla base dell esercizio precedente creare altri due costruttori per i seguenti tipi di oggetti: Autonoleggio: è un singoletto (singleton), ovvero un oggetto garantito in copia unica. L autonoleggio ha tre proprietà inaccessibili: il parco macchine, che è una lista di istanze di Automobili, inizialmente vuota il parco clienti, che è una lista di istanze di Clienti, inizialmente vuota il budget, che è un numero. e quattro metodi: mostra(), che chiama iterativamente il metodo mostra() di tutte le automobili del parco macchine e di tutti i clienti del parco clienti, e in più crea un frammento HTML per il budget, e restituisce un frammento HTML di tutto quanto. acquista(automobile), che inserisce nel parco macchine una Automobile assegnandole un codice; accogli(cliente), che inserisce nel parco clienti un Cliente; noleggia(codice, prezzo), che controlla se l Automobile con il codice specificato è nel parco macchine e se prezzo è uguale al prezzo giornaliero di quella Automobile, restituendo un errore se ci sono problemi, altrimenti restituisce l Automobile togliendola dal parco macchine e aumentando il budget del prezzo specificato. restituisci(automobile), che re-inserisce nel parco macchine l Automobile passata come parametro. Cliente: ha come parametri un nome (una stringa) e un portafoglio (un numero). Ha una proprietà inaccessibile, possesso, che può contenere al massimo una Automobile ed è inizialmente vuota. Ha i seguente metodi: mostra(), che restituisce un frammento HTML che espone le proprietà del Cliente; l HTML contiene un bottone associato al metodo noleggia() e uno associato al metodo restituisci().

8 noleggia(codice, costo), che verifica che non ci siano automobili in possesso, e se è così chiama noleggia() dell Autosalone con i parametri passati, e in caso di successo toglie costo dal portafoglio e aggiunge l automobile nella proprietà possesso. restituisci(), che verifica che ci sia un automobile in possesso e se così chiama restituisci() dell Autosalone e toglie l automobile dalla proprietà possesso. Convertire dalla struttura HTML precedente il bottone Crea automobile in Acquista automobile, che oltre a mostrare il modale Ok/Cancella, crea un istanza di Automobile e chiama il metodo acquista() dell Autonoleggio. Convertire il bottone Mostra Stato, che oltre a cancellare il div dell interfaccia, vi pone lo stato attuale dell autonoleggio chiamandone il metodo mostra(). Si aggiunga il seguente pulsante: Accogli Cliente, che mostra un modale Ok/Cancella che contiene un form con campi per nome e portafoglio, e in seguito all Ok crei un istanza di Cliente e chiami il metodo accogli() dell Autonoleggio.

restituisci(), che verifica che ci sia un automobile in possesso e se così chiama restituisci() dell Autosalone e toglie l automobile dalla proprietà possesso.

Documenti analoghi

Sistema per il monitoraggio della Spesa Sanitaria

Sistema per il monitoraggio della Spesa Sanitaria Sistema per il monitoraggio della Spesa Sanitaria MANUALE D USO 1 INDICE 1. INTRODUZIONE... 3 2.... 4 3. INVIO CERTIFICATO DI MALATTIA... 4 3.1 SELEZIONE...