Il mio script in Ajax per funzionare deve usare la direttiva location.reload (con IE e Mozilla son dolori)

[giannino1995]

Ho uno script in Ajax che per funzionare deve fare un refresh della pagina. Se uso location.reload() lo script funziona ma alcuni browser come Explorer e Mozilla mi danno questo avviso fastidiosissimo:

"Per visualizzare nuovamente la pagina Web, è necessario rinviare tramite Internet Explorer le informazioni inviate in precedenza. Se si sta effettuando un acquisto, etc etc.... " con i bottoni "riprova" e "annulla".

$(document).ready(function() { 
     $('#uploadForm').submit(function(event) {
            event.preventDefault();
            $('#loader-icon').show();
            $(this).ajaxSubmit({
                beforeSubmit: function() {
                  $("#progress-bar").width('0%');
                },
                uploadProgress: function (event, position, total, percentComplete){
                    $("#progress-bar").width(percentComplete + '%');
                    $("#progress-bar").html('<div id="progress-status">' + percentComplete +' %</div>')
                },
                success:function (){
                    $('#loader-icon').hide();
                    location.reload(); // esegue un refresh della pagina
                },
                resetForm: true,
            }); 
            return false;
    });
});

Devo aggiornare la pagina per aggiornare questo script in PHP:

<p class="avviso">
        <?php
        if(isset($_SESSION['avviso_upload'])) {
            echo $_SESSION['avviso_upload'];
            unset($_SESSION['avviso_upload']);
            }
        ?>
    </p>

[giannino1995]

Ho risolto lo script usando target ma resta comunque un problema di fondo: con Ajax si può decidere di aggiornare solo un particolare tag della pagina generato dinamicamente da PHP?

Se il contenuto di un <div> è prodotto da uno script in PHP (esempio: i file presenti in una cartella sul server) come posso con JS dire al server di ricontrollare il contenuto di quel <div>?

Il mio script funziona in questo modo:
1.uno script in PHP mostra a video i file presenti in una cartella A sul server;
2.un form mi permette di caricare un file sul server dentro A con Ajax (voglio una barra che mi aggiorna secondo per secondo sullo stato di avanzamento del mio upload);
3.al termine del caricamento faccio un refresh della pagina per far rigirare lo script del punto 1 (in A è stato aggiunto un file quindi devo aggiornare l’html);

location.reload() non da problemi, lo script funziona egregiamente però con IE e Mozilla genera l’alert che ho scritto sopra.

Avete capito il problema di fondo oppure no?

Se uso questo codice non risolvo:

$(".contenitore_generale").reload();

$(".contenitore_generale") è il div che contiene i nomi dei file presenti nella cartella A.

[cavicchiandrea]

Ho risolto lo script usando target ma resta comunque un problema di fondo: con Ajax si può decidere di aggiornare solo un particolare tag della pagina generato dinamicamente da PHP?

Si è obbiettivo principale di ajax

Se il contenuto di un <div> è prodotto da uno script in PHP (esempio: i file presenti in una cartella sul server) come posso con JS dire al server di ricontrollare il contenuto di quel <div>?

Con ajax

Il mio script funziona in questo modo:
1.uno script in PHP mostra a video i file presenti in una cartella A sul server;

invece di mettere uno script php nella pagina crei una pagina che rileva i file della cartella sul server poi allo onload richiami quella pagina $(".contenitore_generale").load("tuapaginafileserv er.php")

2.un form mi permette di caricare un file sul server dentro A con Ajax (voglio una barra che mi aggiorna secondo per secondo sullo stato di avanzamento del mio upload);

Qui non so che dire spero che funzioni tutto

3.al termine del caricamento faccio un refresh della pagina per far rigirare lo script del punto 1 (in A è stato aggiunto un file quindi devo aggiornare l’html);

Al termine del caricamento non esegui il reload ma richiami nuovamente la pagina tuapaginafileserver.php

location.reload() non da problemi, lo script funziona egregiamente però con IE e Mozilla genera l’alert che ho scritto sopra.

Avete capito il problema di fondo oppure no?

Credo di si

Se uso questo codice non risolvo:

$(".contenitore_generale").reload();

$(".contenitore_generale") è il div che contiene i nomi dei file presenti nella cartella A.

Mi meraviglierei del contrario i div della pagina non hanno eventi o supportano eventi js

[giannino1995]

Ho provato a fare così ma non funziona:

success: function (){ // quando l'upload finisce ajaxSubmit() chiama success
$(".file_su_server").load("pagina_protetta/php/file_su_server.php");
},

<div class="file_su_server">
<?php include("pagina_protetta/php/file_su_server.php"); ?>
</div>

[cavicchiandrea]

Non funziona... interessante ma poco utile per risolvere non trovi?

[giannino1995]

Non funziona... interessante ma poco utile per risolvere non trovi?

Non so che altro dirti nel senso che il codice non fa nulla. I due script sono identici:

success: function (){ // quando l'upload finisce ajaxSubmit() chiama success
$(".file_su_server").load("pagina_protetta/php/file_su_server.php");
},

success: function (){ // quando l'upload finisce ajaxSubmit() chiama success
//$(".file_su_server").load("pagina_protetta/php/file_su_server.php");
},

[cavicchiandrea]

Pagina demo online, così da farsi un idea di come sunziona lo script grazie.

[badaze]

Hai provato una cosa del genere.

<script>
function pippo() {
  // qui fai una chiamata asincrona ad una pagina che ti ritorna la lista dei file e riempe il div
}
</script>
...

$(document).ready(function() { 
     $('#uploadForm').submit(function(event) {
            event.preventDefault();
            $('#loader-icon').show();
            $(this).ajaxSubmit({
                beforeSubmit: function() {
                  $("#progress-bar").width('0%');
                },
                uploadProgress: function (event, position, total, percentComplete){
                    $("#progress-bar").width(percentComplete + '%');
                    $("#progress-bar").html('<div id="progress-status">' + percentComplete +' %</div>')
                },
                success:function (){
                    $('#loader-icon').hide();
                    pippo(); 
                },
                resetForm: true,
            }); 
            return false;
    });
});

[giannino1995]

Se intendi questo si:

function pippo() {
  $(".file_su_server").load("pagina_protetta/php/file_su_server.php");
}

ma non produce nulla, come non esistesse.

[giannino1995]

Ho risolto con un altro codice.

$(".contenitore_generale").load("pagina_protetta.php .contenitore_generale>*");

L'unica cosa che non capisco è perché questo non produce nulla:

$(".contenitore_generale").load("pagina_protetta.php .contenitore_generale");

A cosa serve il segno di maggiore e l'asterisco?!?!