Introduksjon til Ajax i ASP.NET

AJAX i ASP.NET er kjent som Asynchronous JavaScript og XML. Det handler om å oppdatere funksjoner på en webside, uten å laste den inn hver gang vi åpner nettsiden. Det er en teknikk som brukes til å lage veldig raske og dynamiske websider.

Ajax i ASP.NET brukes hovedsakelig når brukeren har dynamisk innhold og må lastes inn flere ganger etter at endringene er gjort. Denne teknologien fremskynder også responstiden på siden. Den har også et brukervennlig grensesnitt og interaktive nettsider.

Arbeid med Ajax i ASP.NET

AJAX er den avanserte versjonen av de statiske sidene som ble brukt i lang tid. AJAX er bygget for dynamisk natur og et brukervennlig miljø. AJAX i ASP.NET fungerer som punktene nedenfor.

  • XMLHTTPRequest-objektet opprettes fra nettleseren og sendes til serversiden.
  • Serveren vil behandle forespørselen sendt av nettleseren og vil sende dataene tilbake til nettleseren med den forespurte detalj.
  • Nettleseren vil behandle dataene og oppdatere innholdet på siden.
  • Når innholdet er oppdatert, kan brukeren se dataene på skjermen.

Anta at du har en ansattes dataregistreringsportal og at du må legge til en ny ansatt i databasen. I flytskjemaet over kan vi se at klienten oppretter en XMLHTTP-forespørsel med de forespurte dataene til serveren. Her vil de ansattes detaljer starte med å legge til for- og etternavn til den ansatte.

På websiden som brukeren allerede ser, må noen få ansattdetaljer legges til i databasen. Det vil vise noen få forslag til navnene som er til stede i navnet som samsvarer med søkeordet. Serveren sender deretter de forespurte dataene tilbake til klienten. Hvis den ansatte i databasen ikke legges til, opprettes en ny oppføring med hans detaljer.

Nå vil klienten behandle dataene som sendes av serveren, og responstiden er raskere sammenlignet med andre teknologier som brukes. Nå blir medarbeiderdetaljene vellykket lagt til i databasen, så hvis detaljene som er lagt til nylig må sees, kan brukeren ganske enkelt legge inn ansattes navn og unike ID for å hente resultatene på skjermen. Her er brukergrensesnittet veldig interaktivt, og responstiden er også mindre.

Eksempler på Ajax i ASP.NET

Her er noen eksempler på Ajax i ASP.NET som blir forklart nedenfor:

Eksempel 1

I dette eksemplet opprettes knappen, men handlingen utføres ikke når vi klikker på knappen.

Kode:



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

Produksjon:

Eksempel 2

I dette eksempelet, ved å klikke på knappen du trenger for å omdirigere den til en annen side, kan vi se hvordan vi kan gjøre tiltak.

Kode:

La oss se hva brukeren skriver.


funksjon tekstfunksjon () (
var obj = document.getElementById ("tekstboks"). verdi;
document.getElementById ("text"). innerHTML = "Bokstavene du skriver:" + obj;
)

Produksjon:

Eksempel 3

I dette eksemplet vil vi diskutere hvordan du utfører lastfunksjon i ajax.

Kode:



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

Produksjon:

Eksempel 4

Etter å ha klikket på knappen vil innholdet i asp-filen bli skrevet ut på skjermen. Det er to metoder for å hente informasjonen, dvs. GET og POST-metoden.

Kode:



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

Produksjon:

Funksjoner av Ajax i ASP.NET

Nedenfor er noen få viktige funksjoner i AJAX i ASP.NET .

  • Brukervennlig: Dette er en av hovedfunksjonene i Ajax der brukergrensesnittet til websiden er så fleksibelt og behagelig for brukeren å bruke siden, ettersom han må måtte fylle alle nødvendige detaljer.
  • Nettsiden raskere: Denne funksjonen i AJAX er den primære ettersom den er bygget for den samme. Denne funksjonen lar nettsiden opprette forespørsel og serverens responstid i løpet av sekunder. Disse funksjonene gjør at nettsiden lastes inn raskere enn de vanlige. Vi trenger ikke å laste inn hele siden hele tiden, bare den spesifikke delen må lastes inn på nytt hvis den er endret.
  • Server uavhengig teknologi: AJAX i asp.net kan brukes uavhengig av hvilket som helst programmeringsspråk som JavaScript, PHP, etc. Mange språk støtter AJAX og dens egenskaper og funksjoner.
  • Ytelse: Den brukes hovedsakelig for ytelsen og hastigheten til en webside. Tiden det tar fra å opprette XMLHTTP-forespørselen til å få datasvaret tilbake fra serveren, er raskt mens du bruker AJAX. Så en av de viktigste faktorene brukes til ytelsesbasis på en webside.
  • Støtte nettlesere: AJAX brukes først og fremst fordi den støtter nesten alle nettlesere som brukes i markedet. Bortsett fra konseptet som oppretter XMLHTTP-objektet, vil behandlingen være den samme for alle nettlesere fordi JavaScript-språk brukes i de fleste webapplikasjoner.
  • Interaktive applikasjoner : Å bruke ajax er veldig enkelt for utvikleren eller programmereren å lage mer interaktive og brukervennlige webapplikasjoner. Som vi vet i dagens verden er alt en toveis prosess der du må legge inn så vel som å få dataene, så det er nyttig i toveis prosessen der klienten kan samhandle med serveren for å hente og skrive dataen.

Konklusjon

I denne artikkelen diskuterte vi funksjonene til AJAX i asp.net og hvordan det fungerer i ASP.Net-applikasjoner. Vi diskuterte også noen eksempler der AJAX brukes og dens egenskaper. Det er en av de mest nyttige og kraftfulle teknologiene for det moderne miljøet. Det er høyt brukt på sosiale mediesider som Facebook, Twitter osv.

Anbefalte artikler

Dette er en guide til Ajax i ASP.NET. Her diskuterer vi funksjonene til Ajax i ASP.NET sammen med eksemplene og kodeimplementering. Du kan også se på følgende artikler for å lære mer -

  1. jQuery Ajax Methods
  2. JSON vs AJAX
  3. Hva er Ajax?
  4. AJAX intervjuspørsmål

Kategori:

Programvare utvikling