Uvod u Ajax u ASP.NET-u

AJAX u ASP.NET-u poznat je kao Asinhroni JavaScript i XML. Sve se odnosi na ažuriranje funkcija web stranice, bez njenog učitavanja svaki put kada otvorimo web stranicu. To je tehnika koja se koristi za stvaranje vrlo brzih i dinamičnih web stranica.

Ajax u ASP.NET-u uglavnom se koristi kada korisnik ima dinamički sadržaj i mora se ponovo učitati nakon što su promjene napravljene. Ova tehnologija također ubrzava vrijeme odziva stranice. Također ima korisničko sučelje i interaktivne web stranice.

Rad Ajaxa u ASP.NET-u

AJAX je napredna verzija statičkih stranica koje su se dugo koristile. AJAX je stvoren za dinamičnu prirodu i okruženje prilagođeno korisniku. AJAX u ASP.NET-u djeluje kao niže navedene točke.

  • Objekt XMLHTTPRequest kreira se iz preglednika i šalje na strani poslužitelja.
  • Poslužitelj će obraditi zahtjev koji je poslao preglednik i podatke će poslati natrag u preglednik sa traženim detaljima.
  • Preglednik će obraditi podatke i ažurirati sadržaj na stranici.
  • Nakon ažuriranja sadržaja korisnik može pregledati podatke na zaslonu.

Pretpostavimo da imate portal za unos podataka o zaposlenicima i da morate dodati novog zaposlenika u bazu podataka. Na gornjoj dijagrami tijeka možemo vidjeti da klijent kreira XMLHTTP zahtjev sa traženim podacima na poslužitelju. Pojedinosti o zaposleniku započet će dodavanjem imena i prezimena zaposlenika.

Na web stranici koju korisnik vidi već nekoliko podataka o zaposlenicima mora biti dodano u bazu podataka. Prikazat će se nekoliko prijedloga imena koja se nalaze u nazivu koji odgovaraju ključnoj riječi. Poslužitelj zatim vraća tražene podatke natrag klijentu. Ako zaposlenik u bazi podataka nije dodan, tada će se stvoriti novi unos s njegovim podacima.

Sada će klijent obraditi podatke koje šalje poslužitelj i vrijeme odziva je brže u usporedbi s drugim korištenim tehnologijama. Sada se podaci o zaposlenicima uspješno dodaju u bazu podataka, pa ako nedavno dodani detalji moraju biti vidljivi, korisnik može jednostavno unijeti ime zaposlenika i jedinstveni ID za dobivanje rezultata na zaslonu. Ovdje je korisničko sučelje vrlo interaktivno, a vrijeme odziva je također manje.

Primjeri Ajaxa u ASP.NET-u

Evo nekoliko primjera Ajaxa u ASP.NET-u koji su objašnjeni u nastavku:

Primjer 1

U ovom primjeru gumb je stvoren, ali radnja se neće izvesti kad kliknemo na gumb.

Kodirati:



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

Izlaz:

Primjer 2

U ovom primjeru, klikom na gumb koji trebate preusmjeriti na neku drugu stranicu, možemo vidjeti kako možemo poduzeti akciju.

Kodirati:

Pogledajmo što korisnik upiše.


funkcijska tekstualna funkcija () (
var obj = document.getElementById ("textbox") vrijednost;
document.getElementById ("tekst"). innerHTML = "Slova koja kucate:" + obj;
)

Izlaz:

Primjer 3

U ovom ćemo primjeru razgovarati o tome kako izvesti funkciju opterećenja u ajaxu.

Kodirati:



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;
)

Izlaz:

Primjer 4

Nakon klika na gumb sadržaj asp datoteke prikazat će se na zaslonu. Postoje dvije metode za dobivanje podataka, tj. Metoda GET i POST.

Kodirati:



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();
)

Izlaz:

Značajke Ajaxa u ASP.NET-u

Dolje su navedene nekoliko važnih značajki AJAX-a u ASP.NET-u .

  • Jednostavan za korisnika: Ovo je jedna od glavnih značajki Ajaxa gdje je korisničko sučelje web stranice toliko fleksibilno i ugodno za korisnika da može koristiti stranicu jer mora ispuniti sve potrebne podatke.
  • Brža web stranica: Ova značajka u AJAX-u je primarna jer je ugrađena za istu. Ova značajka omogućuje web stranici da stvori zahtjev i vrijeme odziva poslužitelja u nekoliko sekundi. Ove značajke također čine da se web stranica ponovno učitava brže od uobičajenih. Ne moramo cijelo vrijeme ponovo učitavati stranicu, samo onaj posebni dio mora se ponovno učitati ako je promijenjen.
  • Tehnologija nezavisna od poslužitelja: AJAX na asp.net-u može se koristiti bez obzira na bilo koji programski jezik poput JavaScript, PHP itd. Mnogi jezici podržavaju AJAX i njegove karakteristike i značajke.
  • Performanse: Uglavnom se koristi za njegovu izvedbu i brzinu web stranice. Vrijeme korištenja XMLHTTP zahtjeva za vraćanje odgovora podataka s poslužitelja je brzo dok se koristi AJAX. Dakle, jedan se od glavnih faktora koristi na temelju uspješnosti na web stranici.
  • Preglednici za podršku: AJAX se primarno koristi jer podržava gotovo sve preglednike koji se koriste na tržištu. Osim koncepta koji stvara XMLHTTP objekt, obrada će biti ista za sve web preglednike, jer se JavaScript jezik koristi u većini web aplikacija.
  • Interaktivne aplikacije : Korištenje ajaxa programeru ili programeru je vrlo lako za stvaranje interaktivnijih i web-aplikacija prilagođenijih korisnicima. Kao što znamo u današnjem svijetu, sve je dvosmjerni proces u koji morate unijeti i dobiti podatke, tako da je korisno u dvosmjernom procesu u kojem klijent može komunicirati s poslužiteljem i dohvatiti ga i pisati podatak.

Zaključak

U ovom smo članku raspravljali o značajkama AJAX-a na asp.net i kako to radi u ASP.Net aplikacijama. Također smo raspravljali o nekoliko primjera gdje se koristi AJAX i njegove karakteristike. To je jedna od najkorisnijih i najmoćnijih tehnologija modernog okoliša. Vrlo se koristi na web stranicama društvenih medija poput Facebooka, Twittera itd.

Preporučeni članci

Ovo je vodič za Ajax na ASP.NET-u. Ovdje smo raspravljali o radu, značajkama Ajaxa u ASP.NET-u zajedno s primjerima i implementacijom koda. Možete pogledati i sljedeće članke da biste saznali više -

  1. jQuery Ajax metode
  2. JSON vs AJAX
  3. Što je Ajax?
  4. AJAX pitanja za intervju

Kategorija:

Razvoj softvera