Introduzione ad Ajax in ASP.NET

AJAX in ASP.NET è noto come JavaScript asincrono e XML. Si tratta di aggiornare le funzioni di una pagina Web, senza caricarla ogni volta che apriamo la pagina Web. È una tecnica utilizzata per creare pagine Web molto veloci e dinamiche.

Ajax in ASP.NET viene utilizzato principalmente quando l'utente ha contenuti dinamici e deve essere ricaricato più volte dopo aver apportato le modifiche. Questa tecnologia accelera anche i tempi di risposta della pagina. Ha anche un'interfaccia intuitiva e pagine Web interattive.

Funzionamento di Ajax in ASP.NET

AJAX è la versione avanzata delle pagine statiche utilizzate a lungo. AJAX è progettato per la natura dinamica e un ambiente intuitivo. AJAX in ASP.NET funziona come i punti elencati di seguito.

  • L'oggetto XMLHTTPRequest viene creato dal browser e inviato al lato server.
  • Il server elaborerà la richiesta inviata dal browser e invierà i dati al browser con i dettagli richiesti.
  • Il browser elaborerà i dati e aggiornerà il contenuto della pagina.
  • Una volta aggiornato il contenuto, l'utente può visualizzare i dati sullo schermo.

Supponiamo di avere un portale per l'immissione dei dati dei dipendenti e di aggiungere un nuovo dipendente nel database. Nel diagramma di flusso sopra, possiamo vedere che il client crea una richiesta XMLHTTP con i dati richiesti al server. Qui, i dettagli del dipendente inizieranno aggiungendo il nome e il cognome del dipendente.

Nella pagina Web che l'utente vede già alcuni dettagli dei dipendenti devono essere aggiunti nel database. Mostrerà alcuni suggerimenti dei nomi presenti nel nome corrispondente alla parola chiave. Il server quindi invia i dati richiesti al client. Se il dipendente nel database non viene aggiunto, verrà creata una nuova voce con i suoi dettagli.

Ora il client elaborerà i dati inviati dal server e il tempo di risposta è più veloce rispetto ad altre tecnologie utilizzate. Ora i dettagli dei dipendenti vengono aggiunti correttamente nel database, quindi se è necessario visualizzare i dettagli aggiunti di recente, l'utente può semplicemente inserire il nome del dipendente e l'ID univoco per recuperare i risultati sullo schermo. Qui l'interfaccia utente è molto interattiva e anche i tempi di risposta sono inferiori.

Esempi di Ajax in ASP.NET

Ecco alcuni esempi di Ajax in ASP.NET che sono spiegati di seguito:

Esempio 1

In questo esempio, il pulsante viene creato ma l'azione non verrà eseguita quando si fa clic sul pulsante.

Codice:



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

Produzione:

Esempio n. 2

In questo esempio, facendo clic sul pulsante è necessario reindirizzarlo su un'altra pagina, possiamo vedere come possiamo agire.

Codice:

Vediamo cosa sta scrivendo l'utente.


funzione textfunction () (
var obj = document.getElementById ("textbox"). value;
document.getElementById ("text"). innerHTML = "Le lettere che stai digitando:" + obj;
)

Produzione:

Esempio n. 3

In questo esempio, discuteremo come eseguire la funzione di caricamento in Ajax.

Codice:



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

Produzione:

Esempio n. 4

Dopo aver fatto clic sul pulsante, il contenuto del file asp verrà stampato sullo schermo. Esistono due metodi per recuperare le informazioni, ad esempio il metodo GET e POST.

Codice:



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

Produzione:

Funzionalità di Ajax in ASP.NET

Di seguito sono elencate alcune importanti funzionalità di AJAX in ASP.NET .

  • Facile da usare : questa è una delle caratteristiche principali di Ajax in cui l'interfaccia utente della pagina Web è così flessibile e comoda per consentire all'utente di utilizzare la pagina in quanto deve riempire tutti i dettagli richiesti.
  • Pagina Web più veloce: questa funzione in AJAX è la principale in quanto è stata creata per lo stesso. Questa funzione consente alla pagina Web di creare la richiesta e il tempo di risposta del server in pochi secondi. Queste funzionalità rendono anche la ricarica della pagina web più veloce delle solite. Non è necessario ricaricare l'intera pagina per tutto il tempo, solo la parte specifica deve essere ricaricata se è stata modificata.
  • Tecnologia indipendente dal server: AJAX in asp.net può essere utilizzato indipendentemente da qualsiasi linguaggio di programmazione come JavaScript, PHP, ecc. Molte lingue supportano AJAX e le sue caratteristiche e caratteristiche.
  • Prestazioni: viene utilizzato principalmente per le prestazioni e la velocità di una pagina Web. Il tempo impiegato dalla creazione della richiesta XMLHTTP per ottenere la risposta dei dati dal server è rapido durante l'utilizzo di AJAX. Quindi uno dei principali fattori viene utilizzato per le prestazioni in una pagina Web.
  • Browser di supporto: AJAX viene utilizzato principalmente perché supporta quasi tutti i browser utilizzati sul mercato. A parte il concetto che crea l'oggetto XMLHTTP, l'elaborazione sarà la stessa per tutti i browser Web poiché il linguaggio JavaScript viene utilizzato nella maggior parte delle applicazioni Web.
  • Applicazioni interattive : l'utilizzo di ajax è molto semplice per lo sviluppatore o il programmatore per creare applicazioni Web più interattive e intuitive. Come sappiamo nel mondo di oggi, tutto è un processo a due vie in cui è necessario inserire e ottenere i dati, quindi è utile nel processo a due vie in cui il client può interagire con il server per recuperare e scrivere i dati.

Conclusione

In questo articolo, abbiamo discusso delle funzionalità di AJAX in asp.net e di come funziona nelle applicazioni ASP.Net. Inoltre, abbiamo discusso alcuni esempi in cui viene utilizzato AJAX e le sue caratteristiche. È una delle tecnologie più utili e potenti per l'ambiente moderno. È molto utilizzato nei siti di social media come Facebook, Twitter, ecc.

Articoli consigliati

Questa è una guida ad Ajax in ASP.NET. Qui discutiamo del funzionamento, delle funzionalità di Ajax in ASP.NET insieme agli esempi e all'implementazione del codice. Puoi anche consultare i seguenti articoli per saperne di più -

  1. Metodi jQuery Ajax
  2. JSON vs AJAX
  3. Che cos'è l'Ajax?
  4. Domande sull'intervista AJAX

Categoria:

Sviluppo software