Accentsconagua

Hoe AJAX-verzoeken te doen met Raw JavaScript deel 2

Code
Share

Een paar weken geleden demonstreerde ik hoe ik AJAX-verzoeken kon maken met onbewerkte JavaScript. In ... van vandaag screencast, we gaan nog een stap verder als we PHP gebruiken om een ​​database te doorzoeken, deze naar het JSON-formaat om te zetten en Javascript gebruiken om deze informatie asynchroon aan te vragen en op de pagina weer te geven. Als je net begint met dit soort concepten, is dit de perfecte video voor jou!

Video

Laatste script "Laden"

Dit codeblok vraagt ​​asynchroon een pagina aan en gebruikt vervolgens het "parseer" -script van Douglass Crockford om een ​​nieuw globaal object te maken. Op die manier kunnen we gemakkelijk de geretourneerde JSON-gegevens filteren. 

 functie laden (url, callback) var xhr; if (typeof XMLHttpRequest! == 'undefined') xhr = new XMLHttpRequest (); else var versions = ["Microsoft.XmlHttp", "MSXML2.XmlHttp", "MSXML2.XmlHttp.3.0", "MSXML2.XmlHttp.4.0", "MSXML2.XmlHttp.5.0"]; for (var i = 0, len = versions.length; i < len; i++)  try  xhr = new ActiveXObject(versions[i]); break;  catch(e)  // end for  xhr.onreadystatechange = function()  if((xhr.readyState < 4) || xhr.status !== 200) return; callback(xhr); ; xhr.open('GET', url, true); xhr.send(");  load('emails.php', function(xhr)  var response = JSON.parse(xhr.responseText); var container = document.getElementById('container'); for(var i = 0, len = response.length; i < len; i++)  container.innerHTML += '
  • '+ antwoord [i] .name +' : '+ antwoord [i] .email +'
    • '; );

    Laatste PHP

    Iets aangepast van de video om de efficiëntie te verbeteren - een veel elegantere oplossing dan wat ik oorspronkelijk ter plekke bedacht. 

     query ('SELECT * FROM contactInfo')) $ renderedArray = array (); while ($ row = $ result-> fetch_object ()) $ returningArray [] = $ rij;  echo json_encode ($ returnArray);  else // fout opgetreden echo 'error:'. $ Mysql-> fout;

    Ik hoop dat jullie allemaal genieten van deze "video-serie die nooit was bedoeld". Oorspronkelijk was het gepland als een enkele tutorial; Vanwege het feit dat er zoveel te behandelen is, wil ik echter graag doorgaan met het maken van meer video's voor jou, dat wil zeggen, als je ze wilt hebben. Laat me gerust weten wat je wilt leren.

    • Volg ons op Twitter, of abonneer je op de NETTUTS RSS-feed voor meer dagelijkse webontwikkelingen, tuts en artikelen.


    Code
    ×