Hello! Using DataTables and an ajax request I want to display a table by passing data to json.

The controller method that json returns:

public string GroupReportPartial() { using (AcademicProgressDb db = new AcademicProgressDb()) { var query = (from Students in db.Students from StudentsSubjects in db.StudentsSubjects from Subjects in db.Subjects from ControlPeriods in db.ControlPeriods from ControlTypes in db.ControlTypes where Students.RecordBookNumber == StudentsSubjects.StId.ToString() where Subjects.SubjectId == StudentsSubjects.SubjId where ControlPeriods.ControlPeriodId == StudentsSubjects.CtrlPeriodId where ControlTypes.ControlTypeId == StudentsSubjects.CtrlTypeId select new GroupsReportModel { StudentGroupNumber = Students.GroupNumber, StudentLastName = Students.LastName, StudentFirstName = Students.FirstName, StudentMiddleName = Students.MiddleName, SubjectName = Subjects.Name, ControlPeriodName = ControlPeriods.Name, ControlTypeName = ControlTypes.Name }).ToList(); return JsonConvert.SerializeObject(query); } }

It works successfully. As a result, I get:

 [{"StudentGroupNumber": 2012,"StudentLastName": "Глобчук","StudentFirstName": "Даниил","StudentMiddleName": "Владимирович","SubjectName": "Иностранный язык","ControlPeriodName": "Второй семестр","ControlTypeName": "Зачет"}]

View code:

 <script type="text/javascript"> $(document).ready(function () { $('#example').DataTable({ ajax: { url: '@Url.Action("GroupReportPartial")', type: 'POST', dataType: 'json', dataSrc: "", columns: [ { data: "StudentGroupNumber", name:"StudentGroupNumber" }, { data: "StudentLastName", name: "StudentLastName" }, { data: "StudentFirstName", name: "StudentFirstName" }, { data: "StudentMiddleName", name: "StudentMiddleName" }, { data: "SubjectName", name: "SubjectName" }, { data: "ControlPeriodName", name: "ControlPeriodName" }, { data: "ControlTypeName", name: "ControlTypeName" } ] } }); }); </script> <table id="example" class="display" style="width:100%"> <thead> <tr> <th>StudentGroupNumber</th> <th>StudentLastName</th> <th>StudentFirstName</th> <th>StudentMiddleName.</th> <th>SubjectName</th> <th>ControlPeriodName</th> <th>ControlTypeName</th> </tr> </thead> </table>

It would seem all is well, but I get an error

DataTables warning: table id = example - Requested unknown parameter '0' for row 0, column 0

The number of columns in json and in view is the same. What could be the reason?

Raised to the main page by a community spirit member ♦ 2 days ago .

This question contains answers that can be both good and bad; the system offered them for verification.

    2 answers 2

    If I understand correctly, your data (JSON) does not reach the function. Try $ (document) .ready (function (data) {...});

    • I seem to be writing this way =) - Dmitry Bystrov
    • sorry, didn’t notice the parameter - Dmitriy Bystrov
    • Anyway, the same mistake did not help - Dmitry Bystrov

    My mistake is due to inattention. Placed the columns parameter inside the ajax parameter, but it was necessary outside of it.

    The correct code of the working script:

     <script type="text/javascript"> $(document).ready(function (data) { $('#example').DataTable({ processing: true, serverSide: true, ajax: { url: '@Url.Action("GroupReportPartial")', type: 'POST', dataType: 'json', dataSrc: "" }, columns: [ { data: "StudentGroupNumber", name: "StudentGroupNumber" }, { data: "StudentLastName", name: "StudentLastName" }, { data: "StudentFirstName", name: "StudentFirstName" }, { data: "StudentMiddleName", name: "StudentMiddleName" }, { data: "SubjectName", name: "SubjectName" }, { data: "ControlPeriodName", name: "ControlPeriodName" }, { data: "ControlTypeName", name: "ControlTypeName" } ] }); }); </script>