Comment utiliser ajaxStart pour montrer chargement spinner?

J'ai une page web qui exécute un script python avec la commande shell_exec. Je voudrais pour un chargement spinner, le "Veuillez patienter pendant que cette page se charge en' sorte de message, pour montrer à tout le script python est en cours d'exécution, puis, après, il est fait pour le reste de l'écho avais HTML à afficher.

J'ai trouvé ce qui semble être une bonne solution à https://stackoverflow.com/a/68503/4630491
mais je suis donc de nouveau à l'ajax que je ne sais pas comment faire pour utiliser la solution. J'ai essayé de faire

<div id="loadingDiv">Please wait while this page loads.</div>
<script>var $loading = $('#loadingDiv').hide();
$(document)
  .ajaxStart(function () {
    $loading.show();
  })
  .ajaxStop(function () {
    $loading.hide();
  });
</script>

mais cela ne fonctionne pas. Dois-je appeler en ajax pour exécuter la ajaxStart? Comment aurais-je l'appeler? Dois-je envelopper le shell_exec dans le code ajax?

Merci beaucoup.

OriginalL'auteur Max | 2015-07-03

  1. 11

    Chaque fois qu'une requête Ajax est sur le point d'être envoyé, jQuery vérifie s'il existe une autre circulation des requêtes Ajax. Si aucun n'est en cours, jQuery déclenche la ajaxStart événement.

    Avoir un gif de chargement de l'image comme indiqué ci-dessous

               <div id="loading">
                <img src="loading.gif" />  
           </div>

    Masquer ce chargement div(car le chargement de l'image doivent être affichés lorsque la requête ajax est envoyée).

                  <script>
                   var $loading = $('#loading').hide();
                   //Attach the event handler to any element
                   $(document)
                     .ajaxStart(function () {
                        //ajax request went so show the loading image
                         $loading.show();
                     })
                   .ajaxStop(function () {
                       //got response so hide the loading image
                        $loading.hide();
                    });
              </script>

    Pour en savoir plus voir à jQuery documentation

    Dois-je appeler en ajax pour exécuter la ajaxStart? Comment aurais-je l'appeler?

    Oui lorsque vous avez déclenché une requête ajax alors seulement ajaxStart va se déclencher automatiquement.

    Pour l'ajax il y a de multiples façons avec jquery, ci-dessous je donne avec la fonction de charge.

                   $( ".result" ).load( "some_file.py" );

    some_file.py la sortie sera inséré dans le div avec la classe nom de la raison.

    Pour déclencher la charge de l'événement, vous pouvez utiliser le bouton cliquez sur ou de tout autre en tant que de besoin.

                   $( ".trigger" ).click(function() {
                  $( ".result" ).load( "some_file.py" );
               });
    aussi à ajouter, Si $.ajax() ou $.ajaxSetup() est appelé avec l'option globale définie à false, le .ajaxStart() la méthode ne sera pas le feu pour l'appel ajax.

    OriginalL'auteur Manohar Gunturu