JSON, HTML e XML sono i formati di dati più usati quando si implementa AJAX con jQuery. L'unico problema con questi formati è che richiedono una certa elaborazione da parte di jQuery. Possiamo usare il testo semplice (text/plain) come alternativa?
Richieste semplici
Quando dobbiamo gestire richieste semplici che prevedono solo la visualizzazione di un messaggio di risposta, allora questo formato è perfetto. Si tenga presente che jQuery è anche in grado di gestire le stringhe come HTML, quindi si può usare questo formato anche per generare strutture DOM.
Tipicamente un linguaggio lato server elabora questo formato come segue:
header('Content-Type: text/plain');
// elabora la richiesta
echo 'Message';
exit();
La richiesta AJAX in jQuery è semplice:
$.ajax({
url: 'ajax.php',
type: 'POST',
dataType: 'text',
data: {
foo: 'Test'
},
success: function(text) {
$('#output').text(text);
}
});
Possiamo anche restituire una stringa HTML:
header('Content-Type: text/plain');
// elabora la richiesta
echo '<p>Message</p>';
exit();
che jQuery gestirà come stringa HTML:
$.ajax({
url: 'ajax.php',
type: 'POST',
dataType: 'text',
data: {
foo: 'Test'
},
success: function(text) {
$('#output').html(text);
}
});
Richieste complesse
Ora immaginiamo di dover gestire una richiesta complessa come l'invio e la validazione di un form. Lo script lato server dovrà creare una stringa di risposta abbastanza complessa:
header('Content-Type: text/plain');
$errors = array();
$output = '';
// valida il form
if(count($errors) > 0) {
foreach($errors as $error => $type) {
$output .= 'error-' . $error . ':' . $type . ',';
}
} else {
$output = 'Success';
}
echo $output;
exit();
Se ci sono errori di validazione, la stringa apparirà simile alla seguente:
error-email:Not a valid e-mail address,error-username:Invalid username,
jQuery quindi deve elaborare e manipolare la stringa di risposta:
$.ajax({
url: 'ajax.php',
type: 'POST',
dataType: 'text',
data: $('form').serialize(),
success: function(text) {
var html = '';
if(text.indexOf('error') != -1) {
var responseStr = text.replace(/,$/, '');
var responseParts = response.split(',');
for(var i = 0; i < responseParts.length; i++) {
var responsePart = responseParts[i];
var messages = responsePart.split(':');
var errorClasses = messages[0].split('-');
html += '<div class="' + errorClasses[0] + ' ' + errorClasses[1] + '">' + messages[1] + '</div>';
}
} else {
html = '<p class="success">' + text + '</p>';
}
$('#output').html(html);
}
});
Conclusioni
Come si può notare, il formato testo semplice è utile solo per gestire richieste semplici. Quando dobbiamo invece gestire richieste complesse, questo formato richiede un lungo processo di elaborazione e manipolazione delle stringhe da parte di jQuery.