Javascript scope von array und konvertieren js array zu einem php array

Question

Edit/Clarification: Ich habe eine PHP-Seite, nenne es displayPhotos.php, in dem ich einen AJAX-Aufruf auf eine andere PHP-Seite, nennen Sie es getPhotos .php, die eine Datenbank abfragt und Bildinformationen (Bildunterschrift, Dateiname usw.) an displayPhotos.php zurückgibt, wo sie angezeigt werden. Ich verwende PHP in displayPhotos, um die von getPhotos zurückgegebenen Daten zu manipulieren. Die zurückgegebenen Daten vom Ajax-Aufruf sind ein zweidimensionales Javascript-Array. Ich muss das Javascript-Array in ein PHP-Array umwandeln, damit ich sie und andere Dinge anzeigen kann. Wie mache ich das? Hoffe, das hilft.

---

Meine Augen schmerzen beim Lesen aller Dokumente.

Ich möchte Ajax verwenden, um eine Datenbank abzufragen, geben Sie die Daten zurück und verwenden Sie dann PHP, um mit der Webseite fortzufahren.

Alle Beispiele, die ich mir angesehen habe, beginnen mit dem Erstellen des JSON in PHP. Ich muss mit dem json-Objekt in Javascript beginnen.

In diesem Fall übergebe ich nichts an die PHP-Datei, die die DB abfragt. Das Konsolenprotokoll zeigt an, dass der Dateiname im Photoarray korrekt ist, aber sobald es außerhalb dieser Funktion ist, verschwindet es, obwohl es als global deklariert ist, ich denke es ist trotzdem. Warum und was muss ich tun, um das zu beheben?

Die PHP-Datei macht nur eine SELECT * FROM ..... und gibt alles zurück.

// in fhs_get_photos.php 
    // SELECT * FROM table...... 
    echo $json = json_encode($result); 
    return $json; 

So habe ich jetzt das Array zurück, aber es ist in Javascript. Wenn ich das Scope-Problem herausgefunden habe, wie kann ich dieses Javascript-Array in ein PHP-Array konvertieren?

<h3>Welcome to the Historical Society's historical photo archive 
    </h3> 
    </header> 
    <figure id="photo_figure"> 
     <script> 
     //line below gets me: SCRIPT5007: Unable to get property 'thumb' of 
     //undefined or null reference 
     console.log("photoarray thumb: ") + photoarray[0]['thumb']; 
     </script> 

Erkläre ich das richtig?

Answer 1

Zuerst ist AJAX async. Dies bedeutet, dass es die Anforderung sendet, wenn Sie es anfordern, aber die Antwort irgendwann später erhält. Und es funktioniert, nachdem PHP die Seite gerendert und gesendet hat. Damit. Wenn Sie ein Update über AJAX erhalten, müssen Sie Javascript verwenden, um dieses Update zu machen. Die einfachste Lösung besteht darin, die Antwort direkt im Erfolgsrückruf zu verarbeiten. Auf diese Weise müssen Sie sich nicht mit dem globalen Umfang herumschlagen (was eine schlechte Praxis ist).

Angeblich soll Ihre HTML ist wie folgt:

<header> 
    <h3>Welcome to the Historical Society's historical photo archive 
    </h3> 
    </header> 
    <div id="figures"></div> 

Sie es tun können, indem Sie eine Funktion deklarieren, die die Verarbeitung Griffe:

function updateDom(photoArr) { 
    var $figures = $('#figures'); 

    $.each(photoArr, function() { 
    console.log(this); 
    $figures.append('<img src="' + this.thumb +'">'); 
    }); 
} 

-Code unten in den Erfolg Rückruf platziert

Und führen Sie diese Funktion im Erfolgsrückruf aus und übergeben Sie ihr das Array von json, das analysiert wurde und zu einer gültigen js wurde Objekt.

var photoArray = JSON.parse(photo_array); 
updateDom(photoArray); 

hier ist der fiddle, aber es ist für den DOM Teil nur