Úvod do Ajaxu v ASP.NET

AJAX v ASP.NET je známy ako asynchrónny JavaScript a XML. Je to všetko o aktualizácii funkcií webovej stránky, bez jej načítania zakaždým, keď otvoríme webovú stránku. Je to technika, ktorá sa používa na vytváranie veľmi rýchlych a dynamických webových stránok.

Ajax v ASP.NET sa používa hlavne vtedy, keď má užívateľ dynamický obsah a po vykonaní zmien sa musí znova načítať viackrát. Táto technológia tiež urýchľuje čas odozvy stránky. Má tiež užívateľsky prívetivé rozhranie a interaktívne webové stránky.

Fungovanie Ajaxu v ASP.NET

AJAX je pokročilá verzia statických stránok, ktoré sa používali po dlhú dobu. AJAX je navrhnutý pre dynamickú prírodu a užívateľsky prívetivé prostredie. AJAX v ASP.NET funguje ako nižšie uvedené body.

  • Objekt XMLHTTPRequest je vytvorený z prehľadávača a odoslaný na stranu servera.
  • Server spracuje požiadavku odoslanú prehliadačom a odošle údaje späť do prehliadača s požadovanými podrobnosťami.
  • Prehliadač spracuje údaje a aktualizuje obsah na stránke.
  • Po aktualizácii obsahu môže užívateľ zobraziť údaje na obrazovke.

Predpokladajme, že máte portál na zadávanie údajov o zamestnancovi a do databázy musíte pridať nového zamestnanca. Vo vyššie uvedenom vývojovom diagrame vidíme, že klient vytvorí požiadavku XMLHTTP s požadovanými údajmi na server. Podrobnosti o zamestnancovi sa tu začnú pridaním mena a priezviska zamestnanca.

Na webovej stránke, ktorú už používateľ vidí, je potrebné do databázy pridať niekoľko podrobností o zamestnancovi. Ukáže niekoľko návrhov mien, ktoré sa nachádzajú v názve zhodujúcom sa s kľúčovým slovom. Server potom pošle požadované údaje späť klientovi. Ak zamestnanec v databáze nebude pridaný, vytvorí sa nový záznam s jeho údajmi.

Teraz klient spracuje údaje odoslané serverom a čas odozvy je rýchlejší v porovnaní s inými použitými technológiami. Teraz sú údaje o zamestnancovi úspešne pridané do databázy, takže ak je potrebné vidieť detaily pridané nedávno, používateľ môže jednoducho zadať meno zamestnanca a jedinečné ID, aby získal výsledky na obrazovke. Tu je užívateľské rozhranie veľmi interaktívne a čas odozvy je tiež kratší.

Príklady Ajax v ASP.NET

Tu je niekoľko príkladov Ajaxu v ASP.NET, ktoré sú vysvetlené nižšie:

Príklad č. 1

V tomto príklade je tlačidlo vytvorené, ale akcia nebude vykonaná, keď klikneme na tlačidlo.

kód:



Example of AJAX
Let's take examples on buttons
Click on this button



Example of AJAX
Let's take examples on buttons
Click on this button



Example of AJAX
Let's take examples on buttons
Click on this button



Example of AJAX
Let's take examples on buttons
Click on this button



Example of AJAX
Let's take examples on buttons
Click on this button

Výkon:

Príklad č. 2

V tomto príklade kliknutím na tlačidlo, ktoré musíte presmerovať na inú stránku, vidíme, ako môžeme konať.

kód:

Pozrime sa, čo používateľ píše.


function textfunction () (
var obj = document.getElementById ("textbox"). value;
document.getElementById ("text"). internalHTML = "Písmená, ktoré píšete:" + obj;
)

Výkon:

Príklad č. 3

V tomto príklade diskutujeme o tom, ako vykonávať funkciu načítania v ajaxe.

kód:



AJAX EXAMPLE ON LOAD
Click on this button

function load(url, copy_function) (
var xhttp;
xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange = function() (
if (this.readyState == 4 && this.status == 200) (
copy_function(this);
)
);
xmlhttp.open("GET", url, true);
xmlhttp.send();
)
function loadfunction(xmlhttp) (
document.getElementById("Demonstration").innerHTML =
xmlhttp.responseText;
)



AJAX EXAMPLE ON LOAD
Click on this button

function load(url, copy_function) (
var xhttp;
xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange = function() (
if (this.readyState == 4 && this.status == 200) (
copy_function(this);
)
);
xmlhttp.open("GET", url, true);
xmlhttp.send();
)
function loadfunction(xmlhttp) (
document.getElementById("Demonstration").innerHTML =
xmlhttp.responseText;
)



AJAX EXAMPLE ON LOAD
Click on this button

function load(url, copy_function) (
var xhttp;
xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange = function() (
if (this.readyState == 4 && this.status == 200) (
copy_function(this);
)
);
xmlhttp.open("GET", url, true);
xmlhttp.send();
)
function loadfunction(xmlhttp) (
document.getElementById("Demonstration").innerHTML =
xmlhttp.responseText;
)

Výkon:

Príklad č. 4

Po kliknutí na tlačidlo sa obsah súboru ASP vytlačí na obrazovku. Na získanie informácií existujú dve metódy, tj metóda GET a POST.

kód:



AJAX EXAMPLE ON LOAD
This example is for POST method
Click on this button

function loadPOST() (
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() (
if (this.readyState == 4 && this.status == 200) (
document.getElementById("Demonstration").innerHTML = this.responseText;
)
);
xmlhttp.open("POST", “ajax_load_POST.asp”, true);
xmlhttp.send();
)



AJAX EXAMPLE ON LOAD
This example is for POST method
Click on this button

function loadPOST() (
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() (
if (this.readyState == 4 && this.status == 200) (
document.getElementById("Demonstration").innerHTML = this.responseText;
)
);
xmlhttp.open("POST", “ajax_load_POST.asp”, true);
xmlhttp.send();
)



AJAX EXAMPLE ON LOAD
This example is for POST method
Click on this button

function loadPOST() (
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() (
if (this.readyState == 4 && this.status == 200) (
document.getElementById("Demonstration").innerHTML = this.responseText;
)
);
xmlhttp.open("POST", “ajax_load_POST.asp”, true);
xmlhttp.send();
)



AJAX EXAMPLE ON LOAD
This example is for POST method
Click on this button

function loadPOST() (
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() (
if (this.readyState == 4 && this.status == 200) (
document.getElementById("Demonstration").innerHTML = this.responseText;
)
);
xmlhttp.open("POST", “ajax_load_POST.asp”, true);
xmlhttp.send();
)



AJAX EXAMPLE ON LOAD
This example is for POST method
Click on this button

function loadPOST() (
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() (
if (this.readyState == 4 && this.status == 200) (
document.getElementById("Demonstration").innerHTML = this.responseText;
)
);
xmlhttp.open("POST", “ajax_load_POST.asp”, true);
xmlhttp.send();
)

Výkon:

Funkcie Ajax v ASP.NET

Nižšie sú uvedené niektoré dôležité vlastnosti AJAX v ASP.NET .

  • Užívateľsky prívetivý: Toto je jedna z hlavných funkcií Ajaxu, kde užívateľské rozhranie webovej stránky je pre používateľa tak flexibilné a pohodlné, že musí vyplniť všetky požadované podrobnosti.
  • Webová stránka rýchlejšia: Táto funkcia v AJAX je primárna, pretože bola vytvorená pre tú istú funkciu. Táto funkcia umožňuje webovej stránke vytvoriť požiadavku a čas odozvy servera v priebehu niekoľkých sekúnd. Tieto funkcie tiež zrýchlia načítanie webovej stránky ako obvykle. Nemusíme znova načítať celú stránku vždy, keď sa zmenila, musí sa znova načítať iba konkrétna časť.
  • Technológia nezávislá od servera: AJAX v asp.net sa dá použiť bez ohľadu na programovací jazyk, ako je JavaScript, PHP, atď. Mnoho jazykov podporuje AJAX a jeho vlastnosti a vlastnosti.
  • Výkon: Používa sa hlavne na výkon a rýchlosť webovej stránky. Čas potrebný na vytvorenie požiadavky XMLHTTP na získanie dátovej odpovede zo servera je pri používaní AJAX rýchly. Jeden z hlavných faktorov sa preto používa na základe výkonnosti na webovej stránke.
  • Podporované prehliadače: AJAX sa používa predovšetkým, pretože podporuje takmer všetky prehliadače používané na trhu. Okrem konceptu, ktorý vytvára objekt XMLHTTP, bude spracovanie rovnaké pre všetky webové prehliadače, pretože jazyk JavaScript sa používa vo väčšine webových aplikácií.
  • Interaktívne aplikácie : Ajax je pre vývojárov alebo programátorov veľmi jednoduchý na vytváranie interaktívnejších a užívateľsky príjemnejších webových aplikácií. Ako vieme v dnešnom svete, všetko je obojsmerný proces, do ktorého musíte vkladať a získavať údaje, takže je užitočné v obojsmernom procese, v ktorom klient môže so serverom komunikovať a načítať aj zapísať. dáta.

záver

V tomto článku sme diskutovali o vlastnostiach AJAX v asp.net a o tom, ako to funguje v aplikáciách ASP.Net. Diskutovali sme tiež o niekoľkých príkladoch použitia AJAX a jeho charakteristikách. Je to jedna z najužitočnejších a najvýkonnejších technológií pre moderné prostredie. Používa sa vysoko na sociálnych sieťach ako Facebook, Twitter atď.

Odporúčané články

Toto je príručka pre Ajax v ASP.NET. Tu diskutujeme prácu, vlastnosti Ajaxu v ASP.NET spolu s príkladmi a implementáciou kódu. Ďalšie informácie nájdete aj v nasledujúcich článkoch -

  1. jQuery Ajax metódy
  2. JSON vs AJAX
  3. Čo je Ajax?
  4. AJAX Interview Otázky

Kategórie:

Vývoj softvéru