2017-08-11 1 views
0

J'essaye d'obtenir ajax pour renvoyer des images pour une galerie interne. Je l'ai retourné les images que je veux, le seul problème est que les images retournées est une demande derrière.ajax request continue de retourner la dernière requête

E.g. Si j'ai appelé return_img("test", 1, 5) aucune image n'est renvoyée mais lorsque j'appelle return_img("test", 6, 10) les images 1 à 5 de l'album de test sont renvoyées.

Mon code javascript

function return_img(album, start, end) { 
    vars = "album" + album + "&start=" + start + "&end=" + end; 
    _("out").innerHTML = ""; 

    var request = new XMLHttpRequest(); 
    request.open("POST", "gallery_return_img.php", true); 
    request.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
    request.onreadystatechange = function() { 
     if (request.readyState === 4 && request.status === 200) { 
      var returned = request.responseText; 
      returned = JSON.parse(returned); 
      for (i = 0; i < Object.keys(returned).length; i++) { 
       x = document.createElement("div"); 
       y = document.createElement("img"); 
       y.setAttribute("src", returned[i].url); 
       x.appendChild(y); 
       document.getElementById("out").appendChild(x); 
      } 
     } 
    }; 
    request.send(vars); 
} 

Mon code PHP

if (key_exists('album', $_POST) && key_exists('start', $_POST) && key_exists('end', $_POST)) { 
    $album = $_POST['album']; 
    $start = $_POST['start']; 
    $end = $_POST['end']; 
    $render = json_decode(file_get_contents("/gallery_images/$album/info.pics")); 
    $total = count($render); 
    if($end > $total){ 
     $end = $total; 
    } 
    $pictures = []; 
    for($start; $start <= $end; $start++) { 
     array_push($pictures, $render[$start]); 
    } 
} 

Le fichier info.pics contient une liste codée JSON des URL et des noms d'image doivent rendre les images de cet album.

+0

Bienvenue sur Super User! Veuillez noter que les questions de programmation devraient être posées sur [donc]. Pour plus d'informations sur notre site, consultez notre [tour]. –

+1

'aucune image n'est retournée' - vérifiez les navigateurs ** développeur ** outils console pour vérifier ce que la demande renvoie - note: votre code PHP semble ne rien envoyer, car il n'y a rien sortie par ce code –

+0

Je suppose (Il est difficile de dire à partir du code que vous avez posté) que l'élément côté serveur prend un peu à traiter et il semble simplement qu'il traite la demande précédente en raison du délai. Comme @JaromandaX votre onglet réseau devrait rendre cela évident. – Liam

Répondre

-1

La moitié a trébuché sur le problème après avoir relu la syntaxe a XMLHttpRequest().

Asynchrone est défini sur true.

request.open("POST", "gallery_return_img.php", true); 

Je l'ai mis à false et pas plus de problème. Je ne comprends pas pourquoi cela fait une différence, mais cela fonctionne.