Tutvustus Ajaxiga ASP.NET-is

AJAX-i ASP.NET-is tuntakse asünkroonse JavaScripti ja XML-na. See kõik seisneb veebilehe funktsioonide värskendamises, laadimata seda iga kord, kui veebilehte avame. See on tehnika, mida kasutatakse väga kiirete ja dünaamiliste veebilehtede loomiseks.

Ajaxit ASP.NET-is kasutatakse peamiselt siis, kui kasutajal on dünaamiline sisu ja pärast muudatuste tegemist tuleb seda mitu korda uuesti laadida. See tehnoloogia kiirendab ka lehe reageerimisaega. Samuti on kasutajasõbralik liides ja interaktiivsed veebilehed.

Ajaxi töötamine ASP.NET-is

AJAX on pikka aega kasutatud staatiliste lehtede täiustatud versioon. AJAX on loodud dünaamilise looduse ja kasutajasõbraliku keskkonna jaoks. ASP.NET-is olev AJAX töötab nagu allpool loetletud punktid.

  • Objekt XMLHTTPRequest luuakse brauserist ja saadetakse serveripoole.
  • Server töötleb brauseri saadetud päringut ja saadab vajalikud andmed brauserisse tagasi.
  • Brauser töötleb andmeid ja värskendab lehe sisu.
  • Kui sisu on värskendatud, saab kasutaja andmeid ekraanil vaadata.

Oletame, et teil on töötajate andmesisestuse portaal ja peate andmebaasi lisama uue töötaja. Ülaltoodud vooskeemil näeme, et klient loob serverisse taotletud andmetega XMLHTTP-päringu. Siin alustatakse töötaja üksikasjadega töötaja ees- ja perekonnanime lisamisega.

Veebilehel, mida kasutaja juba näeb, tuleb andmebaasi lisada mõned töötaja andmed. Selles kuvatakse mõned ettepanekud märksõnale vastavas nimes esinevate nimede kohta. Seejärel saadab server nõutud andmed kliendile tagasi. Kui töötajat andmebaasi ei lisata, luuakse uus kirje tema andmetega.

Nüüd töötleb klient serveri saadetud andmeid ja reageerimise aeg on teiste kasutatud tehnoloogiatega võrreldes kiirem. Nüüd lisatakse töötaja andmed andmebaasi edukalt, nii et kui hiljuti lisatud üksikasju tuleb näha, saab kasutaja ekraanile tulemuste saamiseks lihtsalt sisestada töötaja nime ja kordumatu id. Siin on kasutajaliides väga interaktiivne ja ka reageerimise aeg on lühem.

Ajaxi näited ASP.NET-is

Allpool on toodud mõned näited Ajaxi kohta ASP.NET-is.

Näide nr 1

Selles näites nupp luuakse, kuid nuppu klõpsates toimingut ei tehta.

Kood:



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äljund:

Näide 2

Selles näites näeme, kuidas saaksime toiminguid teha, klõpsates nupul, mille peate suunama selle mõnele teisele lehele.

Kood:

Vaatame, mida kasutaja kirjutab.


funktsioon textfunction () (
var obj = document.getElementById ("textbox") väärtus;
document.getElementById ("text"). innerHTML = "Teie kirjutatavad tähed:" + obj;
)

Väljund:

Näide 3

Selles näites räägime sellest, kuidas ajaxis koormusfunktsiooni täita.

Kood:



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äljund:

Näide 4

Pärast nupul klõpsamist prinditakse asp-faili sisu ekraanile. Teabe hankimiseks on kaks meetodit, st GET ja POST meetod.

Kood:



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äljund:

Ajaxi omadused ASP.NET-is

Allpool on loetletud mõned AJAX-i olulised funktsioonid ASP.NET-is .

  • Kasutajasõbralik: see on Ajaxi üks peamisi funktsioone, kus veebilehe kasutajaliides on lehe kasutamiseks nii paindlik ja mugav, et ta peab täitma kõik nõutavad üksikasjad.
  • Veebileht kiirem: see AJAX-i funktsioon on peamine, kuna see on sama jaoks loodud. See funktsioon võimaldab veebilehel sekundite jooksul luua päringu ja serveri reageerimise aja. Need funktsioonid muudavad veebilehe uuesti laadimise tavalistest kiiremaks. Me ei pea kogu lehte kogu aeg uuesti laadima. Ainult konkreetne osa tuleb uuesti laadida, kui seda on muudetud.
  • Serverist sõltumatu tehnoloogia: asp.netis asuvat AJAX-i saab kasutada sõltumata programmeerimiskeelest, nagu JavaScript, PHP jne. Paljud keeled toetavad AJAX-i ning selle omadusi ja funktsioone.
  • Toimivus: seda kasutatakse peamiselt veebilehe jõudluse ja kiiruse jaoks. AJAX-i kasutamisel kulub XMLHTTP-päringu loomisest kuni andmete vastuse serverist tagasi saamiseni aeg. Niisiis kasutatakse veebisaidil jõudluse alusena ühte peamist tegurit.
  • Tugibrauserid: AJAX-i kasutatakse peamiselt seetõttu, et see toetab peaaegu kõiki turul kasutatavaid brausereid. Lisaks XMLHTTP objekti loovale kontseptsioonile on töötlemine kõigi veebibrauserite jaoks sama, kuna enamikus veebirakendustes kasutatakse JavaScripti keelt.
  • Interaktiivsed rakendused : ajaxi kasutamine on arendajal või programmeerijal väga lihtne luua interaktiivsemaid ja kasutajasõbralikumaid veebirakendusi. Nagu me tänapäeva maailmas teame, on kõik kahesuunaline protsess, kus tuleb nii andmeid sisestada kui ka hankida, seega on abiks kahesuunaline protsess, kus klient saab serveriga suhelda nii tõmbamiseks kui ka kirjutamiseks. andmed.

Järeldus

Selles artiklis arutasime asp.net-is AJAX-i funktsioone ja selle toimimist ASP.Net-i rakendustes. Samuti arutasime mõnda näidet, kus AJAX-i kasutatakse ja selle omadusi. See on kaasaegse keskkonna jaoks kõige kasulikum ja võimsam tehnoloogia. Seda kasutatakse laialdaselt sotsiaalmeedia saitidel nagu Facebook, Twitter jne.

Soovitatavad artiklid

See on ASP.NET-i Ajaxi juhend. Siin käsitleme ASP.NET-is Ajaxi toimimist, funktsioone koos näidete ja koodi rakendamisega. Lisateabe saamiseks võite vaadata ka järgmisi artikleid -

  1. jQuery Ajaxi meetodid
  2. JSON vs AJAX
  3. Mis on Ajax?
  4. AJAX-i intervjuu küsimused

Kategooria:

Tarkvaraarendus