Barra laterale
programmazione:dojo:attendere_pagina_in_iframe
Attendere il caricamento di un iframe in maniera modale con Dojo
Autore: Fabio Di Matteo
Ultima revisione: 05/12/2009
In questo esempio si vedra' come far si che l'utente sia “obbligato” ad aspettare il caricamento di una pagina web contenuta dentro un iframe. Dopo che l'utente avra' cliccato su di un link verra' bloccato l'accesso a tutta la pagina, una progress bar scandira' il tempo fino all'avvenuto caricamento della pagina.
Siccome un esempio vale meglio di mille parole e' possibile vedere il tutto all'opera:
Il codice
Per mostrare i widget viene usato dojo, ma il grosso lo fanno le funzioni attendi() e chiudi() insieme all'evento Onload dell'iframe. In piu' c'è da dire che e' stato modificato il tema nihilo per evitare che compaia il bottone X per chiudere la finestra modale (e' stata semplicemente tolta l'immagine
e rinominato il tema in nihilonoclose ).
Al click sull'href viene eseguita la funzione attendi() che non fa altro che mostrare il form modale con la progressbar e aprire la pagina dentro il frame mioframe. Una volta aperta completamente la pagina dentro l'iframe si attiva l'evento onLoad dell'oggetto il quale e' collegato alla funzione chiudi() . La funzione chiudi() ,se il form modale (dialog1) e' gia' instanziato, lancia un timeout di 1/10 di secondo dopo il quale chiude il form con tramite il relativo metodo dialogo.hide(); .
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Prova Dojo</title> <style type="text/css"> @import "dijit/themes/tundra/dijit.css"; @import "dijit/themes/nihilo-noclose/nihilo-noclose.css"; @import "dojo/resources/dojo.css"; @import "dijit/tests/css/dijitTests.css"; body { font-size: 0.9em; font-family: Geneva, Arial, Helvetica, sans-serif; } </style> <script type="text/javascript" src="dojo/dojo.js" djConfig="parseOnLoad: true"></script> <script type="text/javascript"> function attendi() { dijit.byId('dialog1').show(); window.frames['mioframe'].window.location='https://www.freemedialab.org/pob'; } function chiudi() { if(dijit.byId('dialog1') != null) { dialogo=dijit.byId('dialog1'); setTimeout("dialogo.hide();",100) ; } } </script> </head> <body class="nihilonoclose"><br><br><br><br><div align="center"><b>Pagina di prova</b><br><br> <script type="text/javascript"> dojo.require("dijit.Dialog"); dojo.require("dijit.ProgressBar"); dojo.require("dojo.parser"); </script> <a href="#" onclick="attendi()" >Clicca se hai coraggio!</a><br><br> <div dojoType="dijit.Dialog" id="dialog1" title="Elaborazione in corso..." > <div align="center">Attendere il caricamento dei dati,<br> la pagina ritornera' attiva automaticamente.<br><br> <div dojoType="dijit.ProgressBar" indeterminate="true" style="width:300px" jsId="jsProgress" id="downloadProgress"></div> </div> </div> <iframe name="mioframe" width="800" height="600" onLoad="chiudi();">Per visualizzare il contenuto e' meglio aggiornare il browser.</iframe> </div></body> </html>
programmazione/dojo/attendere_pagina_in_iframe.txt · Ultima modifica: 18/04/2018 - 15:48 (modifica esterna)
Strumenti Pagina
Ad eccezione da dove è diversamente indicato, il contenuto di questo wiki è soggetto alla seguente licenza: CC Attribution-Share Alike 4.0 International
