Charger des tableaux de bord jQuery ASP.Net MVC JSONResult

Je vais essayer d'obtenir les tables de données(http://datatables.net) de travail avec un JsonResult retourné par une ASP.Net MVC Contrôleur. Je reçois un "DataTables avertissement (table id = "exemple"): Demande paramètre inconnu '0' à partir de la source de données pour la ligne d'erreur 0" qui, selon les docs signifie qu'il ne peut pas trouver les colonnes.

Le code dans le contrôleur qui renvoie le JsonResult ressemble:

    public JsonResult LoadPhoneNumbers()
    {
        List<PhoneNumber> phoneNumbers = new List<PhoneNumber>();
        PhoneNumber num1 = new PhoneNumber { Number = "555 123 4567", Description = "George" };
        PhoneNumber num2 = new PhoneNumber { Number = "555 765 4321", Description = "Kevin" };
        PhoneNumber num3 = new PhoneNumber { Number = "555 555 4781", Description = "Sam" };

        phoneNumbers.Add(num1);
        phoneNumbers.Add(num2);
        phoneNumbers.Add(num3);

        return Json(phoneNumbers, JsonRequestBehavior.AllowGet);
    }

Numéro de téléphone est juste une plaine de classe C# avec 2 propriétés, le Nombre et la Description.

Le javascript qui récupère et les charges de l'apparence des données:

<script>
$(document).ready(function () {
    $('#example').dataTable({
        "bProcessing": true,
        "sAjaxSource": '/Account/LoadPhoneNumbers/',
        "sAjaxDataProp": ""
    });
});
</script>

Et le code html ressemble à:

<table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
<thead>
    <tr>
        <th>
            Number
        </th>
        <th>
            Description
        </th>
    </tr>
</thead>
<tbody>
</tbody>
<tfoot>
</tfoot>
</table>

J'ai délibérément mis sAjaxDataProp à une chaîne vide, de sorte que les tables de données n'a pas l'air de aaData. Même quand je définir explicitement aaData comme dans le contrôleur:

return Json(new { aaData = phoneNumbers });

Que j'ai toujours l'erreur. Des conseils s'il vous plaît?

Merci!

source d'informationauteur PW763

  1. 17

    Le suivant fonctionne très bien pour moi:

    $(function () {
    $('#example').dataTable({
        bProcessing: true,
        sAjaxSource: '@Url.Action("LoadPhoneNumbers", "Home")'
    });
});

    J'ai enlevé la sAjaxDataProp propriété.

    avec cette source de données:

    public ActionResult LoadPhoneNumbers()
{
    return Json(new
    {
        aaData = new[] 
        {
            new [] { "Trident", "Internet Explorer 4.0", "Win 95+", "4", "X" },
            new [] { "Gecko", "Firefox 1.5", "Win 98+ /OSX.2+", "1.8", "A" },
            new [] { "Webkit", "iPod Touch /iPhone", "iPod", "420.1", "A" }
        }
    }, JsonRequestBehavior.AllowGet);
}

    et pour ton exemple avec les téléphones simplement:

    public ActionResult LoadPhoneNumbers()
{
    var phoneNumbers = new List<PhoneNumber>(new[] 
    {
        new PhoneNumber { Number = "555 123 4567", Description = "George" },
        new PhoneNumber { Number = "555 765 4321", Description = "Kevin" },
        new PhoneNumber { Number = "555 555 4781", Description = "Sam" }
    });

    return Json(new
    {
        aaData = phoneNumbers.Select(x => new[] { x.Number, x.Description })
    }, JsonRequestBehavior.AllowGet);
}
  2. 0

    Dans ce exemple il apparaît que les données renvoyées par la méthode de contrôleur doit être dans un format spécifique. Il s'agit en fait de retourner la liste dans le cadre de aaData. Il explique également ce que chaque paramètre est pour. Peut-être vous êtes tout simplement pas le formatage de la retourner dans un format json que les tables de données comprend.

    public class HomeController : Controller
{
    public ActionResult AjaxHandler(jQueryDataTableParamModel param)
    {
        return Json(new{
                sEcho = param.sEcho,
                iTotalRecords = 97,
                iTotalDisplayRecords = 3,
                aaData = new List<string[]>() {
                    new string[] {"1", "a1", "a2", "a3"},
                    new string[] {"2", "b1", "b2", "b3"},
                    new string[] {"3", "c1", "c2", "c3"}
                    }
            },
        JsonRequestBehavior.AllowGet);
    }
}