Microsoft AJAX Library – ASP.NET nélkül

Ahogy az már a februári MSDN Kompetenciák Egyetemén is elhangzott, a Microsoft AJAX megoldásának egyik pillére a Microsoft AJAX Library. Ez a komponens lényegében három JavaScript fájl, amely az ASP.NET AJAX szerver oldali szolgáltatásaitól (UpdatePanel, webszolgáltatások stb.) függetlenül is használható, másként fogalmazva megáll a saját lábán, nem kell hozzá ASP.NET, sőt akár más szerver oldali technológiákkal (pl. PHP-vel) is összeházasíthatjuk.

Hogy bizonyítsuk a Microsoft AJAX Library szerver függetlenségét, ágyazzuk be nyers HTML oldalba! Lépések:

  1. A Microsoft AJAX Library script fájljatit tartalmazó ZIP letöltése és kibontása.
  2. Egy üres HTML oldal létrehozása.
  3. Szkript referenciák megadása a HTML oldalon. Amire szükség lehet:
    • Gyakran elég a MicrosoftAjax.js.
    • Ha extrákat is akarunk használni, akkor ne sajnáljuk kibányászni a Futures FTP-ből a preview scripteket. Kontrollok kezeléséhez a PreviewScript.js, csilivili animációkhoz pedig a PreviewGlitz.js kell.
    • Hibakereséshez nem baj, ha kéznél van a scriptek debug változatai is. Sőt, nálam az animációk csak a PreviewGlitz.debug.js fájllal mentek, a release verzióval nem!
  4. Az oldal alján inicializáljuk az AJAX Libraryt azzal, hogy meghívjuk a Sys.Application.initialize() metódust.
  5. Ellenőrzés: ha mindent jól csináltunk, akkor meg fog hívódni a pageLoad() metódusunk, amiben már a $get() függvény működni fog.

A teljes oldal kódja (feltételezve, hogy a szkriptek a Scripts mappában vannak):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Kezdőlap</title>
    
    <!-- Microsoft AJAX runtime -->
    <script type="text/javascript" src="Scripts/MicrosoftAjax.js"></script>
    <script type="text/javascript" src="Scripts/PreviewScript.js" ></script>
    
    <script language="javascript" type="text/javascript">
        // Automatikusan meghívódik, amikor az oldal betöltődött
        function pageLoad()
        {
            var txtName = new Sys.Preview.UI.TextBox( $get( "txtName" ) );
            Sys.Preview.UI.Window.messageBox( txtName.get_text() );
        }    
    </script>        
    
</head>

<body>
    <div>
        Az Ön neve:
        <input id="txtName" type="text" value="Szia Világ!" />
    </div>    

    <!-- Microsoft AJAX runtime inicializálása -->
    <script language="javascript" type="text/javascript">
        Sys.Application.initialize();
    </script>
</body>
</html>

Buktatók (ha nem működne):

  • Nem mindegy, hogy milyen sorrendben vannak a <script> tag-ek és az sem, hogy a <head> vagy a <body> részei.
  • A <script> nem működik úgy, ha önmagát zárjuk be, kell a különálló zárótag, tehát <script … /> nem jó, csak <script …></script> működik. Vajon miért? smile_sarcastic
  • Néhány dolog használható az AJAX Library-ben az initialize() meghívása nélkül is, de ha ott van, akkor legyen az oldal végén.

A legszebb az egészben, hogy az eredmény nem csak szerver, hanem böngésző független is (legalábbis amit az AJAX Library támogat), kipróbáltam Firefoxban, működik!

Mi mindent tud még az AJAX Library? Aki eljön a március 31-i Web Konferenciára, kaphat egy kis ízelítőt! smile_wink

 

Technorati tags: ,

3 thoughts on “Microsoft AJAX Library – ASP.NET nélkül

  1. Peter

    A script tag helyben történő (zárótag nélküli) lezárása a html-be épített általános scriptmotornak köszönhetően nem működik, ugyanis az a következőképpen értelmezi a dolgokat:
    Minden átadandó a script tagban található megfelelő típusú (type="") parsernek, ami a script és / script tagek között található + magának a script tagnak a paraméterei. Mi történik tehát a script / esetben? A fájl teljes script utáni tartalma átadódik a javascript motornak, ami ha utána gondolunk, minden, csak nem jó.
    Ez különben annak az oka, hogy azt, hogy / script nem írhatjuk le símán javascriptben, hanem helyette "/scr"+"ipt" és hasonlókkal kell kisérletezni – a buta parser nincs feljogosítva arra, hogy elkezdje szintaktikailag elemezni azt, hogy mi a tartalma, az éppen kommentben van-e, stb., hanem egyszerűen a /script szót keresi.

  2. György

    Köszi, Péter, szerintem leírtam a kulcsszót: "buta parser". Ezek szerint lényegében nem tudja, mi az az XML, csak a HTML-t ismeri. Jó tudni, ezentúl meg sem próbálok majd összevonni HTML tag-eket🙂
    Köszi a tippet!

Vélemény, hozzászólás?

Adatok megadása vagy bejelentkezés valamelyik ikonnal:

WordPress.com Logo

Hozzászólhat a WordPress.com felhasználói fiók használatával. Kilépés / Módosítás )

Twitter kép

Hozzászólhat a Twitter felhasználói fiók használatával. Kilépés / Módosítás )

Facebook kép

Hozzászólhat a Facebook felhasználói fiók használatával. Kilépés / Módosítás )

Google+ kép

Hozzászólhat a Google+ felhasználói fiók használatával. Kilépés / Módosítás )

Kapcsolódás: %s