Ajax használata Joomla keretrendszerben

Joomlás oldalon ajaxos modul? Meglévő modul ajaxosan működik? Az Ajaxnak és a Joomlának együtt csak a képzelet szab határt!

Ajax és Joomla

Bizonyára mindenki hallott már az Ajaxról. Ha igen, akkor itt most nem a "Florál-fieszta" kifejezésnek kellene beugrania. Aki csak keveset tud róla, annak pár szóban: az Ajax (ahogy a neve is mutatja - Asynchronous JavaSript and XML) egy technológia neve, ahol asszinkron kérés megy a szerver felé, ahonnan egy választ kapunk vissza, amit feldolgozhatunk, anélkül, hogy a teljes oldalunk újrahúzódna.

Az egész lényege annyi, hogy bizonyos eseményekre (pl amikor egy mező elveszti a fókuszt, vagy az egérrel rámutatunk valamire) egy kérés megy a szerver felé, nagyon kevés adatmennyiséggel, a szerver feldolgozza azt, és a választ visszaküldi, amelyet egy javascript függvény feldolgoz. Olyan, mintha a szerver megszólítana egy általunk megadott javascript függvényt amikor kész (vagy részben kész) a feldolgozással.

Szerver szólít meg böngészőt?? Egy állapotmentes protokollon?? Mielőtt mindenki megkövez, hangsúlyozom, hogy mintha. Valójában a kliens küldözget requesteket, és figyeli a responsokat.

Hogy jön a képbe a Joomla? Mint az már bizonyára mindenkinek feltünt, a sargatulipan.hu a Joomla keretrendszerrel készült. Szerintem a Joomla nagyon jó keretrendszer, de a fejlesztők egy dolgot rendesen kihagytak belőle, mégpedig az Ajax támogatást. No nem kis work-around-dal elérhetjük, hogy az oldalunkon könnyen, gyorsan, hatékonyan tudjunk Ajaxos modulokat megjeleníteni, illetve meglátjátok mennyire egyszerű a már meglévő komponenseket, modulokat Ajaxossá tenni. Előrebocsátom, bele kell nyúlni egy-két forrásállományba, ez nem olyan "egérrel kattingatok - de jó" munka, aki erre számít attól előre is elnézést kérek.

Vágjunk bele!

Kliens oldal (ezek a templateünk index.php-jába kerülnek):

Példányosítani kell egy request objektumot a <HEAD>-ben, egy <SCRIPT> tag-ban. Ez globális lesz az oldalunkra nézve.

function createRequestObject() {     
      var ro;     
      var browser = navigator.appName;
      if(browser == "Microsoft Internet Explorer"){
          ro = new ActiveXObject("Microsoft.XMLHTTP");
      }else{
          ro = new XMLHttpRequest();
      }
      return ro;
  }
  var http = createRequestObject();

csináltam 2 saját függvényt is, amelyeken keresztül hívom a szerver oldali logikát.

Most jön a trükk (erről a szerver oldali részben írok):

 var mosConfig_live_site = 'http://www.sargatulipan.hu';
  var ajaxHandle = mosConfig_live_site + '/index.php?Itemid=65';

 function sndReqMod(aModName,aParam,aResponseMethod) {
     http.open('get', ajaxHandle + '&mod=' + aModName + aParam);
     http.onreadystatechange = aResponseMethod;
     http.send(null);
  }
  function sndReqCom(aComName,aParam,aResponseMethod) {
     http.open('get', ajaxHandle + '&com=' + aComName + aParam);
     http.onreadystatechange = aResponseMethod;
     http.send(null);
  }

Miután ez megvan, már csak hívni kell azeket a függvényeket a megfelelő módon felparaméterezve. A következő kis példában a bejelentkezésnél használt felhasználói név mezőbe írt értéket ellenőrizzük, miután a fókusz elhagyja a mezőt. Az alábbi javascript metódus-t "hívja" a szerver.

<SCRIPT>
     function handleResponseLogin() {
     if(http.readyState == 4){   
     //ez jelenti azt, hogy a szerver oldal befejezte a működését
        var response = http.responseText;
        document.getElementById('loginMessage').innerHTML = 
        response != ''? response : "";
     }
  </SCRIPT>

Definiáljuk az input tag-et.

<div id="loginMessage"></div>
     Felhasználónév: 
     <input type="text" onblur=
     'sndReqMod("mod_cbloginrc2","&value=
        "+this.value,handleResponseLogin);'/>

A response-t a szerver oldal generálja ki, jelenleg HTML formátumban. Ami a responsban visszajön, azt adjuk értékül a mező fölötti div-nek.

Ugye, nem is olyan nehéz... Ennyi a kliens oldal!

HAMAROSAN JÖN A SZERVER OLDALI RÉSZ BEMUTATÁSA IS!

Az alapötlet egyébként a joomla kérés feldolgozásában rejlik.

[ Vissza ]

SárgaTulipán vendégház - Noszvaj - Szállás

Ajax használata Joomla keretrendszerben

Joomlás oldalon ajaxos modul? Meglévő modul ajaxosan működik? Az Ajaxnak és a Joomlának együtt csak a képzelet szab határt!