Apr 202013
 

Quando facciamo chiamate ajax e quindi richieste asincrone al nostro web server, potremmo incappare nel problema delle chiamate fantasma: ovvero faccio una richieste, ovviamente resto nella pagina, ma per qualche motivo il server non risponde, vediamo come gestire questa situazione.

La prima parte di html è semplice: bottone e div target:


<h2>Premi il pulsante per effettuare una richiesta ajax.</h2>
<button id="trigger">GET</button><br>

La parte successiva la dedicheremo a gestire la chiamata in modo tradizionale, chiederemo un json:


$(document).ready(function() {
$('#trigger').click(function() {
...
});
});

A questo punto si tratta di strutturare la chiamata ajax in modo un po’ diverso,

ovvero alla chiamata ajax passeremo come coppia key/value la url e il dataType


e successivamente useremo il metodo then() che accetta due parametri che saranno due funzioni di callback

una per il successo, la prima, una per la gestione dell’errore, la seconda.


.then(
function(data) {$('#target').append('Valore restituito: '+ data.name + '<br>');},
function() {$('#target').append('Chiamata AJAX fallita.<br>');}

Ultimo step con il metodo always() dichiareremo la fine delle operazioni, dato che avviene sia in caso di successo sia in caso di insuccesso.


.always(function() {
$('#target').append('FINE');

L’esempio

 

 

 

 

Sorry, the comment form is closed at this time.