Visualizzazione dei risultati da 1 a 2 su 2
  1. #1
    Utente di HTML.it
    Registrato dal
    Nov 2007
    Messaggi
    473

    AJAX upload problemma passaggio dei dati

    Ciao a tutti,
    ho questa funzione che avevo recuperato da qualche guida ma non mi ricordo dove...
    Praticamento ho il seguente form dove l'utente scrive un messaggio, stile facebook, e una volta fatto click sul button la input text si svuota ed il commento che ha scritto lo vede nella lista facendo un classico append.

    Il tutto funziona, fino a quando non ho dovuto aggiungere la possibilità di fare un upload multiplo di file...
    Di seguito vedete il codice del form e ajax, la parte in rosso è quella aggiunta per upload, senza questa parte in rosso mi scrive il commento correttamente...

    codice:
    <form name="formcom<?php echo $id_conv; ?>" onSubmit="javascript:xmlhttpPost('risposta.php','commento<?php echo $id_conv; ?>','formcom<?php echo $id_conv; ?>','content_comment'); return false;" enctype="multipart/form-data">
        
                                    <label>Commento: <span>*</span></label>
                                    <textarea cols="40" name="commento" rows="1" style="height:30px; min-height:20px; margin-bottom:10px;" required></textarea>
                                    
                                    <img src="emoticons/1.gif" alt="emoticons" title="Apri emoticons" onclick="showHide('panel_emoticons')" style="display:inline">
                                    <input type="hidden" name="id_conv" value="<?php echo $id_conv; ?>" />
        
        
                            <input type="submit" class="submit" style="float:right"  value="Scrivi messaggio" />
                            <div class="clearfix"></div>
                            
                             <div class="formRow" style="float:left">    
                                <label for="file" style="float:left; margin-top:5px;">Seleziona le immagini da caricare </label>
                                <input type="file" id="file1" name="file"  accept="image/*" multiple style="margin-top:8px;">
                            </div>
    

    AJAX

    codice:
    <script language="Javascript">
    //Funzione per la gestione asincrona AJAX
    function xmlhttpPost(strURL,risultato,nome_form,elenco) {
    //Inizializzo l'oggetto xmlHttpReq
    var xmlHttpReq = false;
    var self = this;
    // qui valutiamo la tipologia di browser utilizzato per selezionare la tipologia di oggetto da creare.
    // Se sono in un browser Mozilla/Safari, utilizzo l'oggetto XMLHttpRequest per lo scambio di dati tra browser e server.
    if (window.XMLHttpRequest) {
    self.xmlHttpReq = new XMLHttpRequest();
    }
    // Se sono in un Browser di Microsoft (IE), utilizzo Microsoft.XMLHTTP
    //che rappresenta la classe di riferimento per questo browser
    else if (window.ActiveXObject) {
    self.xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
    }
    //Apro il canale di connessione per regolare il tipo di richiesta.
    //Passo come parametri il tipo di richiesta, url e se è o meno un operazione asincrona (isAsync)
    self.xmlHttpReq.open('POST', strURL, true);
    
    //setto l'header dell'oggetto
    self.xmlHttpReq.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    //con UPLOAD
    self.xmlHttpReq.setRequestHeader('Content-Type', 'multipart/form-data');
    
    
    /* Passo alla richiesta i valori del form in modo da generare l'output desiderato*/
    self.xmlHttpReq.send(recuperaValore(nome_form));
    
    /* Valuto lo stato della richiesta */
    self.xmlHttpReq.onreadystatechange = function() {
    
    /*Gli stai di una richiesta possono essere 5
    * 0 - UNINITIALIZED
    * 1 - LOADING
    * 2 - LOADED
    * 3 - INTERACTIVE
    * 4 - COMPLETE*/
    
    //Se lo stato è completo
    if (self.xmlHttpReq.readyState == 4) {
    /* Aggiorno la pagina con la risposta ritornata dalla precendete richiesta dal web server.Quando la richiesta è terminata il responso della richiesta è disponibie come responseText.*/
    aggiornaPagina(self.xmlHttpReq.responseText,risultato,elenco);
    }
    }
    
    }
    /*Questa funzione recupera i dati dal form.*/
    function recuperaValore(nome_form) {
    var form = document.forms[nome_form];
    var commento = form.commento.value;
    var id_conv = form.id_conv.value;
    
    valore = 'id_conv=' + escape(id_conv) + '&commento=' + escape(commento);
    
    
    
    var input = document.getElementById('file1')
    var indice= 0;
        
        for (var x = 0; x < input.files.length; x++) {
            //add to list
            var file = _("file1").files[x]; 
            //alert("file"+x);    
            //alert(file.name+" | "+file.size+" | "+file.type);            
            //formdata.append("file"+x, file); 
            valore=valore + '&file' + x + "=" + escape(file);
            indice=x;
        }
        
        valore=valore + '&indice=' + indice
    
    alert(valore);
    form.commento.value="";
    return valore;
    }
    /*Questa funzione viene richiamata dall'oggetto xmlHttpReq per l'aggiornamento asincrono dell'elemento risultato*/
    function aggiornaPagina(stringa, risultato, elenco){
        //document.getElementById(risultato).innerHTML = stringa;    
        $("#" + elenco).append(stringa);
        
    }

    Nella pagina php recupero tutti i dati ma ho un problema sull'array dei files, non riesco a vedere nulla e non mi esegue l'upload...

    Qualcuno sa dirmi dove sbaglio e se, tramite AJAX posso passare i file di un upload, e se il modo che ho usato è corretto???

    Grazie

    Ciaoo

  2. #2
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,131
    Fino a qualche tempo fa ti avrei detto che non era possibile eseguire upload via ajax, ora non sono più cosi sicuro parti da qui
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

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.