preload IFRAME

z.cristiano

Utente Attivo
16 Giu 2007
145
0
16
Salve a tutti..
Esiste un codice che permettere di fare il PRELOAD iFrame?
Cioè, ho creato un modulo di invio e-mail con dentro iframe e cliccando INVIA legge il codice PHP all'interno iFRAME, deve appare il caricamento PRELOAD e finito di caricare, appare il messaggio inviato..

Dove e come lo posso trovare?
 
Ultima modifica:

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao,
non sono sicuro di aver capito la tua richiesta,
ne approfitto comunque per postare un semplice esempio di chiamata ajax usando il metodo post

Da quello che ho capito vuoi mostrare un messaggio/immagine di attesa tra l'invio dei dati e la risposta del server?

pagina form.php ( ma potrebbe essere anche form.html)

HTML:
<script type='text/javascript'>  
    
    var xmlHttp = getXmlHttpObject();
    
    // come parametri richiede l'identificativo del tag dove mostrare l'esito dell'elaborazione 
    // e la pagina che si occuperà di elaborare i dati e fornire la risposta
    function richiesta_ajax_post(identificativo,percorso_pagina_di_elaborazione){    
        
        stringaPost();        
        xmlHttp.open('POST', percorso_pagina_di_elaborazione, true);    
        xmlHttp.onreadystatechange = function() {
            // nell attesa della risposta possiamo modificare il contenitore inserendo anche un immagine loading
            document.getElementById(identificativo).innerHTML="Attendere prego";
            if(xmlHttp.readyState == 4) { 
                if (xmlHttp.status == 200) {     
                    // mostriamo il risultato dell'elaborazione
                    document.getElementById(identificativo).innerHTML=xmlHttp.responseText;
                }
            }
        };    
        xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");    
        xmlHttp.send(stringa);
    }
    // funzione che preleva i valori dai campi e crea la stringa da passare alla chiamata ajax
    function stringaPost(){
        stringa = "";
        var form = document.forms[0];
        var elementi = form.elements.length;
 
        for(var i = 0; i < elementi; i++){
            if(i < elementi-1){
                stringa += form.elements[i].name+"="+form.elements[i].value+"&";
            }else{
                stringa += form.elements[i].name+"="+form.elements[i].value;
            } 
        }
    }
        
        
    function getXmlHttpObject() {
        
        var xmlHttp=null;
        if (window.XMLHttpRequest) {
            xmlHttp = new XMLHttpRequest();
        }	
        if (window.ActiveXObject) {
            xmlHttp =  new ActiveXObject("Microsoft.XMLHTTP");
        }
	
        return  xmlHttp;
    }

</script>

<div id="messaggio">
    <form action="form.php" method="post" onsubmit="richiesta_ajax_post('messaggio','elabora_form.php');return false;">
        Inserisci il tuo nome : 
        <input type="text" name="nome"/>
        <input type="submit" value="Invia"/>
    </form>
</div>

Dove io ho scritto Attendere prego si puo anche inserire un immagine con il tag img

qui se ne trovano un po http://webgrafica.mrwebmaster.it/gif-animate/webmaster/loading/

elabora_form.php
PHP:
<?php

// metto sleep() per simulare l'attesa per l'elaborazione di tutti i dati provenienti dalla form
sleep(3);

// tutto cio che verra stampato in questa pagina verra mostrto nel div indicato
echo "Benvenuto " . $_REQUEST['nome'];

?>

Se sono fuori strada mi scuso, ma, magari potrebbe servire a qualcun'altro :)
 

z.cristiano

Utente Attivo
16 Giu 2007
145
0
16
Questo lo so fare..

Ma non è chiesto..
Ho creato così il codice

<script>

function registra()
{

document.getElementById('form1').target = 'aggiorna';

document.getElementById('form1').action = 'registra.php';

document.getElementById('form1').submit();

}

</script>
<form name="prova">
<input type="text" name="nome"><input type="submit" onclick="registra()" value="Registra">
<iframe id="aggiorna" name="aggiorna" width="0" height="0" frameborder="0"></iframe>
</form>

Così funziona, ma siccome ho il server molto lento, quindi quando clicco REGISTRA non si capisce se sta caricando o no e allora, mi chiedo se per te è possibile mettere un preload? In modo che cliccando REGISTRA, appare icona di caricamento e quando ha registrato sparisce il PRELOAD.
Esiste ed è possibile?
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Potresti inziare cosi:

HTML:
<script>
    function registra()
    {
        document.getElementById('wait').innerHTML = 'attendere';
        
        document.getElementById('form1').target = 'aggiorna';

        document.getElementById('form1').action = 'registra.php';

        document.getElementById('form1').submit();

    }
</script>

<form id="form1" name="prova">
    <input type="text" name="nome"><input type="submit" onclick="registra()" value="Registra">
    <span id="wait"></span>
    <iframe id="aggiorna" name="aggiorna" width="0" height="0" frameborder="0"></iframe>
</form>

aggiungi uno span e lo riempi all onclick con il metodo innerHTML
per svuotarlo non so ancora .... ci devo pensare

comunque non credo che sia lento a causa del tuo server perche va lento anche a me in locale cosi
 
Ultima modifica:
Discussioni simili
Autore Titolo Forum Risposte Data
C Immagine di caricamento pagina (preload) jQuery 1
V preload al centro del liquid layout Flash 0
J Best Ways to Preload Image JavaScript with CSS, AJAX Javascript 0
K barra di preload durante caricamento video Flash 2
L aiuto su preload Ajax 0
N preload background image animazione sequenza Javascript 1
emanuelevt problema preload img con glossy Javascript 0
I Preload immagini. HTML e CSS 2
C Preload e clip filmato Flash 1
A preload per pagina inclusa HTML e CSS 0
A preload cd multimediale Flash 0
X [jquery] effetto preload sino a caricamento del div jQuery 1
G preload e swf esterno Flash 1
N problemi barra preload.. Flash 7
C Script preload che funziona solo con IE... Javascript 0
M Aggiungere un preload ai contenuti con jquery jQuery 1
F Aiuto preload!! Aiutatemi.. Flash 1
E preload con barra di avanzamento Flash 6
I Come evitare che il preload compaia 2 volte? Flash 1
B Caricamento immagini in preload e redirect al termine HTML e CSS 5
S Preload video on-line HTML e CSS 0
I Preload! Flash 9
Simosito Su preload Javascript 9
Y rollover + preload Javascript 4
M problema preload Flash 9
Z Preload Immagini e Immagine Ajax 2
A Preload Flash 8
P come realizzare un preload con swish? Flash 2
A Come inserie un preload in una pagina html Flash 0
purno preload immagini HTML e CSS 1
V Preload in una pagina html ASP.NET 1
R preload Flash 7
F Preload Flash 3
P preload + loop Flash 2
T Aiuto Preload HTML e CSS 0
metalgemini Maledetto preload... Flash 4
metalgemini Maledetto preload... Flash 0
S Preload???? Javascript 6
P per preload (importare avi in flash) Flash 0
D preload flash Flash 1
K posizionare variabile da pagina html all'iframe. Javascript 1
L Iframe a schermo intero HTML e CSS 0
L Sovrascrivere CSS iframe su dominio diverso WordPress 0
P [Joomla] Il mio iframe non funziona più Joomla 0
A [Java] caricare un url esterno senza utilizzo di iframe Java 0
T [Javascript] Richiamare un file.js (iframe) in html Javascript 1
A [HTML] iframe HTML e CSS 1
Tommy03 [PHP] Iframe Google Maps PHP 1
S Cliccando su iFrame con JavaScript Javascript 2
C [Javascript] [HTML] È possibile "puntare" un iframe? Javascript 14

Discussioni simili