web-dev-qa-db-fra.com

Recharger la page après l'affichage du message, jQuery

En ce moment, j'ai un formulaire où l'utilisateur entre les informations. Il est ensuite traité par la fonction aj jQuery et est défini sur return false; donc aucun rechargement de page ne se produit après que l'utilisateur a soumis un formulaire. Bien que je doive recharger la page, mais si je supprime return false; il rafraîchit la page avant que le message de réussite ne s'affiche (ce message s'affiche après que l'utilisateur a soumis les données).

     $.ajax({
      type: "POST",
      url: "scripts/process.php",
      data: dataString,
      success: function() {
       $("#st_message").html("<p> Your article was successfully added!</p>");
       //I need to reload page after the above message is shown
      }
     });
    return false;

Alors, comment puis-je recharger la page après le <p> Your article was successfully added!</p> le message s'affiche, avec un léger retard, disons 2 à 3 secondes, afin que l'utilisateur puisse réellement lire le message.

jqueryajaxreload
16
Ilja

Vous pouvez ajouter un délai en utilisant la fonction setTimeout() , telle que:

// This will reload the page after a delay of 3 seconds
window.setTimeout(function(){location.reload()},3000)

Pour vos besoins: 

$.ajax({
      type: "POST",
      url: "scripts/process.php",
      data: dataString,
      success: function() {
           $("#st_message").html("<p> Your article was successfully added!</p>");
           window.setTimeout(function(){location.reload()},3000)
      }
});
return false;

Exemple de travail

34
Rion Williams

Faites-le avec quelque chose comme:

function delayedRedirect(){
    window.location = "/index.php"
}

setTimeout('delayedRedirect()', 3000)

setTimeout est utilisé pour retarder l'appel de la fonction de redirection, dans ce cas, vous pouvez rediriger quelque part vers une nouvelle URL (au cas où vous en auriez besoin également).

Sinon, utilisez location.reload() pour recharger la page.

4
Jakub

Utilisez la méthode setTimeout pour obtenir le délai et la méthode reload pour recharger la page. Notez le paramètre true dans l'appel reload pour vous assurer que la page est réellement rechargée, et pas seulement repeinte à partir du cache.

window.setTimeout(
  function(){
    location.reload(true)
  },
  3000
);
3
Guffa

Voulez-vous dire quelque chose comme: window.location.reload() en JavaScript

2
David Laberge

donnez-le en utilisant

setTimeout("window.location='yourpage.php'",3000);

dans votre code:

 $.ajax({
       type: "POST",
       url: "scripts/process.php",
       data: dataString,
       success: function() {
        $("#st_message").html("<p> Your article was successfully added!</p>");
        setTimeout("window.location='yourpage.php'",3000);//reload after 3 sec.
       }
      });
 return false;
2
mithunsatheesh

L'utilisation du délai d'attente est une très mauvaise idée.

2
chuckfinley
 $.ajax({
  type: "POST",
  url: "scripts/process.php",
  data: dataString,
  success: function() {
  var miliseconds = 2000;

   $("#st_message").html("<p> Your article was successfully added!</p>");
   setTimeout("window.location=window.location", miliseconds);
   //I need to reload page after the above message is shown
  }
 });
1
jlrvpuma
<script type="text/javascript">
 //
 //your action here
 //
 window.setTimeout(function(){self.parent.location="?list"},3000);//after 3 sec go to (?list or example.html page)
 return false;
</script>
1
Maher