Ajax alap IE és FF-re

A népszerű AJAX technologia egyik alapja, hogy javascriptből az oldal újratöltése nélkül tudunk adatokat kérni a szervertől majd ezt feldolgozni. Természetesen ez sem működik könnyen mindkét böngésző alatt.




Témakörök
Bevezető | Foreach javascripttel | Ajax IE és FF-re is |

A következő kis függvény segítségével könnyen és gyorsan megvalósítható például egy listbox feltöltése vagy akár egy div tag dinamikus megjelenítése is:

function wgo_ajax(url, vars, callbackFunction) {

  var request = window.XMLHttpRequest ?

      new XMLHttpRequest() : new ActiveXObject("MSXML2.XMLHTTP.3.0");

  request.open("POST", url, true);

  request.setRequestHeader("Content-Type",

                           "application/x-www-form-urlencoded"); 



  request.onreadystatechange = function() {

    if (request.readyState == 4 && request.status == 200) {

      if (request.responseText) {

          callbackFunction(request.responseText);

      }

    }

  };

  request.send(vars);

}

A függvényt például így is meg lehet hívni: wgo_ajax('/telepulesek.php','kereso=budap',telepules_kiiras);
Ebben az esetben a telepulesek.php script fog lefutni és megkapja paraméterként kereso névvel a budap stringet.
Mivel a függvény nem várja meg a letöltés végét így egy "callback" függvényt használunk. Amikor a letöltés befejeződött ezt a függvényt hívja meg és paraméterben megkapja a php script által generált kimenetet.
Ez például lehet a települések listája ami budap-vel kezdődik.

function telepules_kiiras(szoveg) {

  alert(szoveg);

}

Itt további feldolgozást lehet írni például szétbontani a szöveget és feltölteni vele egy listboxot stb...