PHP + AJAX / Chargement

21 juil. 2008, 14:15

Bonjour,

Je voudrais mettre en place un "chargement" avant l'ouverture d'une page PHP qui est un peu
longue à s'ouvrir (il y a plusieurs millier de requete SQL "insert" dans la page ou je voudrais placer
ce chargement).
J'ai écris un script AJAX qui permet d'appeler une DIV tant que la page PHP n'a pas été chargée.
J'ai écris une page HTML qui permet d'appeler le script PHP.
J'ai écris une page PHP qui permet de simuler la page qui prend du temps à s'afficher en faisant
un sleep.

Voici le code :

- La page HTML index.html :

Code : Tout sélectionner

<html>  
<head>  
<title>Base page for content</title>  
<script src="/jquery.js" type="text/javascript"></script>  
</head>  
<body>  
<div id="contentLoading" class="contentLoading">  
<img src="loading.gif" alt="Loading data, please wait...">  
</div>  
<div id="contentArea">  
</div>  
</body>  
</html>

- Le script AJAX JQuery.js :

Code : Tout sélectionner

<script type="text/javascript">  
<!--  
jQuery(function($) {  
$("#contentArea").load("test.php");  
});  
  
$().ajaxSend(function(r,s){  
$("#contentLoading").show();  
});  
  
$().ajaxStop(function(r,s){  
$("#contentLoading").fadeOut("fast");  
});  
 
//-->  
</script>

- Le script PHP test.php :

<?php
// get the start time  
$start_time = microtime(true);  
 
// sleep for four seconds  
sleep(4);  

// get the end time  
$end_time = microtime(true);  
  
// print out a message  
print "<p>Call to secondary PHP page worked!</p>"; 
print "<p>Elapsed time: " . $end_time . " - " . $start_time . "</p>";  
?>

Le problème est que le DIV qui doit s'arrêter de tourner à la fin du chargement de la page PHP
tourne en permanence ! Du coup je ne vois pas la page PHP et je ne suis pas sur cette page
PHP soit bien appelée.
Mes questions sont : est-il possible de réaliser un chargement d'une page PHP en utilisant AJAX ?
Comment se fait-il que la page PHP ne soit pas appelée / ne s'affiche pas ?
Quelles sont les modification à effectuer ?

Merci d'avance pour vos réponses !

21 juil. 2008, 22:47

Si Si ça marche, mais tu as des erreurs et des manquements dans ton js.

D'abord, il manque le framework jQuery (si tu ne l'as pas fait exprès) il se trouve ici pour téléchargement : http://code.google.com/p/jqueryjs/downl ... 2.6.min.js

Deuxièmement, le script JQuery.js que tu as affiché se trouve dans un fichier séparé et est normalement lié à la page HTML, il ne doit pas comporter alors les clauses <script> et </script> car les scripts js externes ne les comportent pas.
Alors voici ce que j'ai fais :
J'ai téléchargé le fichier : http://code.google.com/p/jqueryjs/downl ... 2.6.min.js
et écrit l'index.html comme suit, en ajoutant un lien vers ce fichier (framework jquery)

Code : Tout sélectionner

<html> 
<head> 
<title>Base page for content</title> 
<script src="jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="jquery.js" type="text/javascript"></script> 
</head> 
<body> 
<div id="contentLoading" class="contentLoading"> 
<img src="loading.gif" alt="Loading data, please wait..."> 
</div> 
<div id="contentArea"> 
</div> 
</body> 
</html>

Voici la page jquery.js :

Code : Tout sélectionner

jQuery(function($) { 
$("#contentArea").load("test.php"); 
}); 
 
$().ajaxSend(function(r,s){ 
$("#contentLoading").show(); 
}); 
 
$().ajaxStop(function(r,s){ 
$("#contentLoading").fadeOut("fast"); 
});

et finalement le même PHP :

<?php
// get the start time  
$start_time = microtime(true);  
 
// sleep for four seconds  
sleep(4);  

// get the end time  
$end_time = microtime(true);  
  
// print out a message  
print "<p>Call to secondary PHP page worked!</p>"; 
print "<p>Elapsed time: " . $end_time . " - " . $start_time . "</p>";  
?>

Et .................................. ça marche

il fait exactement 4 secondes d'attente avant d'afficher le message que le php print.

PHP + AJAX / Chargement

Qui est en ligne