Ajax, abréviation de Asynchronous JavaScript and XML, permet aux applications web d'appliquer des mises à jour partielles à l'interface utilisateur sans recharger la page entière, améliorant ainsi la réactivité aux interactions.

Pour implémenter Ajax avec jQuery, on utilise la méthode $.ajax. Voici un exemple modifié :

// Exemple de syntaxe jQuery Ajax révisée
$.ajax({
    url: '/api/endpoint',
    type: 'POST',
    data: {clé1: valeur1, clé2: valeur2},
    contentType: 'application/x-www-form-urlencoded',
    success: function(reponse) {
        $('#element-cible').val(reponse);
    }
});

Le backend doit retourner un objet HttpResponse. Les paramètres courants incluent :

Le paramètre contentType définit le format des données :

• urlencoded : Format par défaut, données en paires clé-valeur comme nom=valeur&autre=autre_valeur. En POST avec Django, ces données sont accessibles via request.POST.
• formdata : Permet d'envoyer des fichiers. Les données simples vont dans request.POST, les fichiers dans request.FILES.
• application/json : Envoie des données JSON sérialisées, non traitées par défaut, stockées dans request.body pour traitemetn manuel.

Pour envoyer des fichiers avec Ajax, configurez contentType à falce et utilisez un objet FormData :

document.getElementById('btn-envoi').addEventListener('click', function() {
    let donneesFormulaire = new FormData();
    donneesFormulaire.set('nom', 'alice');
    donneesFormulaire.set('age', 30);
    donneesFormulaire.set('fichier', document.getElementById('input-fichier').files[0]);
    
    $.ajax({
        url: '/upload',
        type: 'POST',
        data: donneesFormulaire,
        contentType: false,
        processData: false,
        success: function(resultat) {
            console.log('Upload réussi:', resultat);
        }
    });
});

Pour les échanges de données, il est courant d'utiliser le format JSON. Les réponses backend pour les requêtes Ajax doivent généraleemnt être des objets JSON, souvent des dictionnaires imbriqués. Avec Django, on peut détecter les requêtes Ajax via request.is_ajax() et retourner une réponse JSON :

def vue_principale(requete):
    if requete.is_ajax():
        from django.http import JsonResponse
        donnees = {'statut': 'succès', 'info': 'opération terminée'}
        return JsonResponse(donnees)
    return render(requete, 'template.html')

Django offre un composant de sérialisation intégré pour convertir des QuerySets en JSON, utile pour les projets frontend-backend séparés :

from django.core import serializers

def vue_api(requete):
    queryset = Modele.objects.all()
    donnees_serialisees = serializers.serialize('json', queryset)
    return HttpResponse(donnees_serialisees, content_type='application/json')