[Javascript] suggerimenti su utilizzo onreadystatechange = function()

Discussione in 'Javascript' iniziata da yadercontini, 5 Marzo 2019.

  1. yadercontini

    yadercontini Nuovo Utente

    Registrato:
    5 Marzo 2019
    Messaggi:
    5
    Mi Piace Ricevuti:
    0
    Punteggio:
    1
    Sesso:
    Maschio
    Ciao a tutti, sono appena iscritto e poco esperto in javascript.
    Sto sbattendo la testa su un problema che è probabilmente estremamente semplice da risolvere, ma dal quale non riesco a venirne fuori.
    Per questo motivo, dopo aver fatto un po' di ricerca senza alcun risultato, chiedo a voi se qualcuno può darmi un semplice suggerimento in merito all'utilizzo di onreadystatechange = function() per poter ottenere il risultato del punto e):
    a) utilizzo una semplice pagina html contente il codice che ho inserito sotto, senza alcuna necessità di connettermi a database o a server o a internet, ma lavorando solo ed esclusivamente in locale;
    b) seleziono più file di testo, ad es. file XML, presenti nella stessa cartella del file html utilizzando il classico <input type="file" multiple /> (funziona perfettamente);
    c) recupero i nomi ed i contenuti dei file selezionati (funziona perfettamente);
    d) aggiungo alla fine della pagina corrente i nomi dei file selezionati (funziona perfettamente);
    e) aggiungo, sempre alla fine della pagina, tutti i contenuti dei file selezionati --> non funziona correttamente.
    Mi spiego meglio:
    Ho pensato di recuperare i contenuti utilizzando:
    - stampa.push(this.responseText) all'interno di onreadystatechange = function();
    (ma ho provato anche con il più semplice
    - stampa += this.responseText; in quest'ultimo caso cambiando ovviamente la tipologia di variabile)
    e successivamente di aggiungere i dati alla fine della pagina utilizzando
    - document.getElementById('listacontenuti').innerHTML = stampa.join('') (oppure semplicemente = stampa, se per recuperarli ho usato stampa +=).
    Quello che ottengo è:
    1) se uso document.getElementById('listacontenuti').innerHTML = dall'interno di onreadystatechange = function(), viene accodato sempre un solo contenuto, quello dell'ultimo file, perché probabilmente vengono "sovrascritte" le precedenti aggiunte;
    2) se uso document.getElementById('listacontenuti').innerHTML = dall'esterno di onreadystatechange = function(), non viene accodato più nulla, come se la variabile stampa (che comunque è dichiara a livello superiore e mi aspettavo venisse letta e valorizzata in modo trasparente) venisse "azzerata".
    Anche la variabile i (il contatore del ciclo for) si comporta allo stesso modo.
    Il codice della pagina è il seguente (il comando document.getElementById('listacontenuti').innerHTML = stampa.join('') è ripetuto in più punti perché ho fatto vari tentativi, commentati a lato):
    Codice:
    <html>
    <head>
    <title>
    </title>
    </header>
    <body>
    <h1>LISTA CONTENUTO FILE SELEZIONATI</h1>
    <input type="file" id="filedaselezionare" name="files[]" multiple /><br/>
    <script>
      function handleFileSelect(evt) {
        var files = evt.target.files;
        var output = [], stampa = [], nomefile;
       var xmlhttp = new XMLHttpRequest();
       for (var i = 0, f; f = files; i++) {
           output.push('<li>', escape(f.name), '</li>');
           nomeFile = f.name ;
           xmlhttp.onreadystatechange = function() {
           if (this.readyState == 4 && this.status == 200) {
               stampa.push(this.responseText);
              document.getElementById('listacontenuti').innerHTML = stampa.join('');  // funziona ma aggiunge solo un contenuto perché probabilmente "sovrascrive" i precedenti
           }
    //   document.getElementById('listacontenuti').innerHTML = "Stampa: " + stampa.join('');   // funziona anche questo, ma aggiunge sempre solo un contenuto perché probabilmente "sovrascrive" i precedenti
       console.log(stampa);
       };
       xmlhttp.open("GET", nomeFile , true);
       xmlhttp.send();
    //   document.getElementById('listacontenuti').innerHTML = stampa.join('');   // se esco dalla funzione onreadystatechange = function() non viene aggiunto più nulla alla pagina
       }
    //   document.getElementById('listacontenuti').innerHTML = stampa.join('');  // anche in questo caso, al di fuori della funzione onreadystatechange = function() non aggiunge più nulla alla pagina
       document.getElementById('listafile').innerHTML = '<ol>' + output.join('') + '</ol>';   // mi elenca, correttamente, la lista dei nomi dei file selezionati
       }
      document.getElementById('filedaselezionare').addEventListener('change', handleFileSelect, false);
    </script>
    <output id="listafile"></output>
    <output ID="listacontenuti"></output>
    </body>
    </html>
    Ribadendo che sono neofita, spero di essere stato abbastanza chiaro e vi ringrazio per i suggerimenti.
    Yader
     
    Ultima modifica di un moderatore: 5 Marzo 2019
  2. Max 1

    Max 1 Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    29 Febbraio 2012
    Messaggi:
    3.533
    Mi Piace Ricevuti:
    265
    Punteggio:
    83
    Sesso:
    Maschio
    @yadercontini
    Da regolamento del forum, come tutti noi sei tenuto ad usare il tag [​IMG] quando posti del codice, oppure la funzione codice dalla barra degli strumenti
    [​IMG]
    Inoltre ti prego di leggere attentamente il regolamento generale del forum e quello di sezione dove posti
    Grazie
    Per questa volta te lo sistemo io ma mi raccomando per il futuro
     
  3. yadercontini

    yadercontini Nuovo Utente

    Registrato:
    5 Marzo 2019
    Messaggi:
    5
    Mi Piace Ricevuti:
    0
    Punteggio:
    1
    Sesso:
    Maschio
    Chiedo scusa a tutti per la svista.
    E ringrazio anticipatamente per i suggerimenti che mi arriveranno.
    Saluti
    Yader
     
  4. yadercontini

    yadercontini Nuovo Utente

    Registrato:
    5 Marzo 2019
    Messaggi:
    5
    Mi Piace Ricevuti:
    0
    Punteggio:
    1
    Sesso:
    Maschio
    Ciao a tutti, speravo in una risposta più solerte... poco interessante il problema?
     
  5. Max 1

    Max 1 Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    29 Febbraio 2012
    Messaggi:
    3.533
    Mi Piace Ricevuti:
    265
    Punteggio:
    83
    Sesso:
    Maschio
    Qui nessuno è obbligato a rispondere e fra i collegati al forum conoscere il tuo problema!
    Bisogna che tu abbia pazienza e aspetti che qualcuno conosca l'argomento e abbia voglia di rispondere! Nei forum funziona così
     
  6. marino51

    marino51 Utente Attivo

    Registrato:
    28 Febbraio 2013
    Messaggi:
    2.396
    Mi Piace Ricevuti:
    119
    Punteggio:
    63
    Occupazione:
    free lance
    Località:
    Lombardia
    spesso é difficile rispondere perché si leggono affermazioni non vere
    occorre quindi capire perché vengono fatte e da cosa poi sono smentite

    per esempio,
    var output = [], stampa = [],
    messe all'interno della funzione, reinizializzano le due array ogni volta che la funzione viene richiamata
    quindi non si potrà mai ottenere tutto quello che é stato dichiarato come ottenuto

    vi é anche diverso altro codice non proprio utilizzato per lo scopo voluto
    con un loop senza fine per completare il quadro

    devi anche renderti conto della differenza tra server e client e dello scopo dell'input file

    ti posto una traccia per ciò che vuoi fare, vi sono alcuni alert che dovrebbero farti capire il funzionamento
    ma credo proprio che, come hai strutturato le cose, in ambito client/server, non funzionerà nulla
    perché non puoi leggere un file dal client (giusto per sicurezza)
    ma solo fare l'upload sul server (quindi sei tu che autorizzi il trasferimento del file)
    in ambiente locale é diverso ma non é la filosofia con cui lavorare in ambiente web

    HTML:
    <html>
    <head>
      <title></title>
    </header>
    <body>
    <h3>LISTA CONTENUTO FILE SELEZIONATI</h3>
    <input type="file" id="filedaselezionare" name="files[]" multiple /><br/>
    <output id="listafile"></output>
    <output ID="listacontenuti"></output>
    
    <script>
      var output = [], stampa = [];
    
      function handleFileSelect(evt)
      {
        alert('handleFileSelect');
    
        var files = evt.target.files;
    
        var flen= files.length;
        alert('flen = '+flen);
    
        var nomeFile = document.getElementById("filedaselezionare").value;
        alert('nomeFile = '+nomeFile);
    
        output.push('<li>'+escape(nomeFile)+'</li>');
    
        var olen= output.length;
        alert('olen = '+olen);
    
        document.getElementById('listafile').innerHTML = '<ol>'+output.join('')+'</ol>';
      }
      document.getElementById('filedaselezionare').addEventListener('change', handleFileSelect, false);
    </script>
    </body>
    </html>
    
    questa é la sola lista dei files (2)

    upload_2019-3-7_15-34-32.png
     
  7. yadercontini

    yadercontini Nuovo Utente

    Registrato:
    5 Marzo 2019
    Messaggi:
    5
    Mi Piace Ricevuti:
    0
    Punteggio:
    1
    Sesso:
    Maschio
    Ciao a tutti, innanzitutto desidero precisare che, pur essendo nuovo di questo forum, non sono nuovo dei forum in generale e quindi so benissimo come funzionano e che nessuno è obbligato a rispondermi o a conoscere il mio problema, che devo avere pazienza che qualcuno conosca l'argomento e abbia abbia voglia di rispondere, etc.
    La mia affermazione precedente "...speravo in una risposta più solerte..." è scaturita semplicemente dal fatto che, probabilmente per ignoranza in materia, ritenevo che il problema da me sottoposto fosse una vera bazzecola per dei maestri come voi, proprio perché, come ho specificato all'inizio, con questo codice non dovrò mai lavorare in connessione ad un server ma esclusivamente in locale.
    Oltre a ciò, sempre in modo erroneo, il non aver ricevuto alcuna risposta dopo più di un giorno mi ha fatto pensare di essere stato considerato un pivello che affronta argomenti poco interessanti, e questo mi sarebbe dispiaciuto.
    Detto questo, chiedo nuovamente scusa per quanto è stato ed eventualmente verrà ritenuto da voi scorretto e ringrazio di cuore Marino51 per i suoi consigli ed il suo codice.
    Vi informo che comunque sono riuscito a risolvere da solo il problema ponendo a false il comando open: adesso per le mie esigenze funziona in modo soddisfacente.
    Non so in questo caso quali ulteriori obblighi o incombenze vi siano da espletare in questo forum, e quindi chiedo nuovamente scusa per le eventuali altre mie mancanze e vi saluto.
     
  8. Max 1

    Max 1 Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    29 Febbraio 2012
    Messaggi:
    3.533
    Mi Piace Ricevuti:
    265
    Punteggio:
    83
    Sesso:
    Maschio
    Se hai risolto la discussione finisce qui senza alcun problema. ok.gif
    Buon lacoro
     
Sto caricando...

Condividi questa Pagina