Blokkolás aszinkron postback idejére

Beismerem, már a cím is elég visszás, hiszen az aszinkron postback, az Ajax egyik eredeti célja az volt, hogy a felhasználó kényelme érdekében a postback művelet a háttérben történjen, és ne blokkolja a felhasználói felületet. Ennek ellenére sajnos időnként mégis szükség van arra, hogy az Ajaxos hívás idejére letiltsunk bizonyos vezérlőket, vagy legalábbis a képernyő egyes részeit.

Ehhez nagyon hasznos segítség lehet a jQuery, amit biztosan nem kell bemutatni. Legjobban azt szeretem benne, hogy végtelen mennyiségű plugin érhető el hozzá, (bár egyben ez a hátránya is, gyakran a megfelelő plugin kiválasztása tovább tart, mint utána a beépítése az alkalmazásba), melyek közül a fenti feladatra nekem legjobban a jQuery BlockUI plugin vált be. A letölthető JavaScript fájl mindössze 16KB, de ha vesszük magunknak a fáradtságot és minimalizáljuk, akkor mindössze 7.59 KB-ot foglal, amit még a webszerver tovább tömöríthet, így a kliensnek máris csak 3.6KB-ot kell letölteni.

Ezt a plugint felhasználva a teljes ablakunk (amit itt a példában egy id=”main” attribútummal ellátott div valósít meg) blokkolása egy üzenettel, mellette egy forgó képpel, félig átlátszó szürke átfedéssel (overlay) és egy fehér, keretezett ablakkal középen mindössze ennyi:

  $("#main").block({
    message: ' <img src="progress.gif" /> Feldolgozás folyamatban...',
    css: { border: '1px solid black', width: '200px', padding: '20px', 
color: 'black', 'background-color': 'white' }, overlayCSS: { backgroundColor: '#f2f5f8', opacity: 0.9 } });

A blokkoló üzenet eltűntetése még egyszerűbb:

  $("#main").unblock();

Már csak arra van szükségünk, hogy ezeket a kódokat aszinkron postback esetén hívjuk meg. Szerencsére az ASP.NET Ajax Library PageRequestManager kliens oldali “osztálya” biztosít beginRequest és endRequest eseményeket, melyekre feliratkozhatunk:

  Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(function (sender, args) {
    // Blokkolás itt
  });

  Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function (sender, args) {
    // Blokkolás feloldása itt
  }); 

Ennyi az egész, a kód mehet rögtön a master page tetejére a ScriptManager után, és máris minden oldalon meg fogjuk kapni a Feldolgozás folyamatban… üzenetet aszinkron művelet esetén.

Technorati-címkék: ,,,

One thought on “Blokkolás aszinkron postback idejére

  1. Visszajelzés: Ajaxos fájl feltöltés | Balássy György szakmai blogja

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