Comment transmettre correctement un tableau d'objets à un contrôleur MVC à l'aide de jQuery Ajax ?

Utiliser jQuery Ajax pour envoyer un tableau d'objets à un contrôleur MVC

Lors de l'envoi d'un tableau d'objets à un contrôleur MVC à l'aide de la méthode ajax() de jQuery, le paramètre du contrôleur peut recevoir une valeur null. Cet article présente la solution.

Dépannage de la valeur nulle

Le problème provient généralement d'une sérialisation incorrecte des données et d'une gestion incorrecte du type de contenu. Voici comment y remédier :

1. Définition du type de contenu et du type de données :

   La fonction ajax() nécessite des paramètres contentType et dataType explicites :

   <code class="language-javascript">contentType: 'application/json; charset=utf-8',
   dataType: 'json',</code>

2. Sérialisation JSON :

   Le tableau d'objets doit être sérialisé au format JSON à l'aide de JSON.stringify(). Structurez les données comme ceci :

   <code class="language-javascript">things = JSON.stringify({ things: things });</code>

Exemple illustratif

Cet exemple montre comment transmettre avec succès un tableau d'objets :

<code class="language-javascript">$(document).ready(function() {
    const things = [
        { id: 1, color: 'yellow' },
        { id: 2, color: 'blue' },
        { id: 3, color: 'red' }
    ];

    const data = JSON.stringify({ things: things });

    $.ajax({
        contentType: 'application/json; charset=utf-8',
        dataType: 'json',
        type: 'POST',
        url: '/Home/PassThings',
        data: data,
        success: function() {
            $('#result').html('"PassThings()" successfully executed.');
        },
        error: function(response) {
            $('#result').html(response.responseText); // Display error details
        }
    });
});</code>

Méthode du contrôleur correspondant (exemple C#) :

<code class="language-csharp">public void PassThings(List<Thing> things)
{
    // Process the 'things' list here
}</code>

N'oubliez pas de remplacer /Home/PassThings par votre contrôleur et votre action réels. L'utilisation de error au lieu de failure permet une gestion des erreurs plus informative. Cette approche révisée garantit une transmission correcte des données et évite le null problème de valeur.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!