Visualizzazione dei risultati da 1 a 9 su 9
  1. #1

    Ajax - script barra di caricamento durante un upload di file

    Ciao a tutti,
    è da pochissimo che mi sono avvicinatto ad Ajax (dal momento che uso PHP come linguaggio lato server) e per questo mi ritrovo ancora in quella fase in cui si sta cercando di capire le potenzialità del linguaggio e delle relative applicazioni.

    Tuttavia mi ritrovo la necessità di abinare una barra di caricamento ad uno script php che permette l'upload di un file sul server.

    Stavo guardando questo articolo:

    barra di caricamento

    devo ammettere che è davvero bello l'effetto e soprattutto utile per trasmettere all'utente il concetto che è necessario aspettare per il completamento dello scritp.

    Ho letto con attenzione l'articolo ma non ho ben capito dove va messo il codice PHP per effettuare lo script.

    Inoltre volevo approfittare per chiedere se vi è già qualche script, anche più semplice, che comunque visualizzi un testo di attesa durante l'esecuzione di uno script php.
    In sostanza la mia esigenza è quella di far visualizzare all'utente, dopo che quest'ultimo ha cliccato sul tasto INVIA del form, un testo di attesa che appunto indichi all'utente di aspettare che lo script termini l'esecuzione.

    Potete consigliarmi qualcosa di abbastanza semplice?

    Grazie
    Ciao

  2. #2
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,131
    Scusa ma pensi di uplodare i file tramite ajax?
    Ciao.
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  3. #3
    Originariamente inviato da cavicchiandrea
    Scusa ma pensi di uplodare i file tramite ajax?
    Ciao.
    No no! Forse per la fretta mi sono espresso male e sono stato poco chiaro.

    L'uplod del file avviene, naturalmente, tramite uno script php che effettua tutti i controlli del caso (dimensioni, tipo, grandezza, formato, ecc) e poi effettua il trasferimento del file sul server.

    Naturalmente maggiore è il peso (in KB) del file è maggiore è il tempo di attesa per lo svolgimento dello script in php per l'upload.

    Per evitare che si veda la pagina bianca durante l'esecuzione dello script in php, vorrei aggiungere una semplice applicazione in AJAX che mi visualizzi un testo o un immagine del tipo:

    codice:
    Caricamento del file in corso...
    Devi attendere che lo script effettui l'upload....stai buono e fai il bravo  :D
    In questo modo l'utente capisce che deve attendere il tempo necessario per l'esecuzione dello script.

    Quando poi lo script ha terminato i suoi processi l'utente viene reindirizzato alla pagina di conferma oppure il messaggio di attesa viene cambiato con un messaggio di conferma o di errore.

    Mi sono spiegato?
    Esiste qualche script semplice da poter utilizzare?
    Io ho usato fino adesso uno script che faceva uso degli i-frame, ma vorrei evitare di usarli perchè non mi piacciono molto ( i-frame)

    Grazie

  4. #4
    Utente di HTML.it L'avatar di m4rko80
    Registrato dal
    Aug 2008
    residenza
    Milano
    Messaggi
    2,654
    http://www.pixeline.be/experiments/jqUploader/test.php


    Qui ci sono 2 esempi fatti con jquery.

    Il sito ufficiale con i relativi plugin e' questo http://plugins.jquery.com/

    Il belle di jquery e' anche che spesso e' tutto testato per i diversi browser

  5. #5
    Grazie per il tuo contributo.
    Lo script che mi hai segnalato è davvero gradevole ed utile, ma ho notato che il campo file del form è realizzato in flash.

    Poichè nel form in questione ci sono diversi campi preferirei evitare il flash e pertanto lascerei il semplice HTML per quanto riguarda il form e i relativi campi, mentre con il php gestirei l'upload del file sul server.

    Conoscete altre soluzioni?

    Ad esempio con google adsense ho notato che durante l'elebarazione di uno script viene visualizzata un immagine gif tipo questa che ho allegato giusto per far capire all'utente che deve attendere l'esecuzione.

    A me basterebbe anche una cosa così semplice.... nulla di particolarmente elaborato.
    Immagini allegate Immagini allegate

  6. #6
    Utente di HTML.it L'avatar di m4rko80
    Registrato dal
    Aug 2008
    residenza
    Milano
    Messaggi
    2,654
    Ciao, ho letto ora magari hai gia risolto.
    Potresti mettere in un div la parte col form di upload volendo o solo la parte col campo di input del form. Poi con lo script ajax richiami il metodo che esegue l'upload e far refreshare solo quel div appunto e nel mentre esegue l'upload far mostrare l'immagine desiderata.

  7. #7
    Hai qualche link di esempio da mostrarmi oppure del codice?

    Grazie 1000

  8. #8
    Utente di HTML.it L'avatar di m4rko80
    Registrato dal
    Aug 2008
    residenza
    Milano
    Messaggi
    2,654
    Io uso questo e puo' essere richaiamo sia in get che post(nell esempio get)

    Codice PHP:
    function ahah(url,target,delayfunction_extrapost){    

        var 
    type "GET";
        if(
    window.XMLHttpRequest){
              var 
    req=new XMLHttpRequest();
        }else if(
    window.ActiveXObject){
              var 
    req=new ActiveXObject("Microsoft.XMLHTTP");
        }
        if(
    req!=undefined){
            if(
    post)
                
    type "POST";
            
    req.open(type,url,true);
            if(
    post){
                
    req.setRequestHeader("Content-Type""application/x-www-form-urlencoded");
            }
            
            
    req.onreadystatechange=function(){
                if(
    req.readyState!=4){
                    
                }else{                                                                
                    
    ahahDone(requrl,target,delayfunction_extra);
                }
            };
            
            
    req.send(post);
        }
    }

    function 
    ahahDone(requrl,target,delayfunction_extra){
        
        
        if(
    req.readyState==4)
        {
            
            
    alert('fai qualcosa durante il caricamento.....');
            
            if(
    req.status==200)
            {
                if(
    target)
                {

                    
    document.getElementById(target).innerHTML='';
                                    
    document.getElementById(target).innerHTML=req.responseText;                                                
                }    
                
                if (
    function_extra){ 
                                                 
                    
    setTimeout(function_extra100);
                    
                }
            }
        }

    qusto sopra e' il file ahah.js da includere nell <head> della pagina

    Nella pagina html(o php cmq):
    Codice PHP:
    <head>
    <
    script type="text/javascript" src="ahah.js"></script>
    <script>
    function prova()
    {
        ahah('index.php?prova=1', 'idtag');
    }
    </script>
    </head>
    <body>
    [url="#"]click[/url]
    <div id="idtag">prima del caricamento</div>
    ..... 
    passi al metodo l'ulr con tutti i parmetri che ti servono e il secondo e' l'id del div da refreshare

    In index.phpcome da url passata)
    Codice PHP:
    if($_GET['prova']){
        echo 
    'dopo caricamento';

    Vedrai che ci sara' un alert e in quella parte di codice gli dirai tu cosa fare.. ad esempio visualizzare il div con l immagine che vuoi per poi nasconderlo a fine caricamento

    EDIT: dove vedi if(req.status==200) nel codice, li ha finito l esecuzione e prima di modificare l'innerHTML nascondi l'immagine

  9. #9
    Grazie 1000, lo provo e ti faccio sapere.

    Sei stato gentilissimo

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.