0
votes

I am working with the DataTable jquery plugin inside my asp.net mvc web application.

i have the following model class:-

public partial class Emp
    {
        public int EmpID { get; set; }
        public string FName { get; set; }
        public string LName { get; set; }
        public Nullable<int> DeptID { get; set; }

        public virtual Dept Dept { get; set; }
    }

the following script:-

 <script type="text/javascript">
        $(document).ready(function () {

            $('#myDataTable').dataTable({
                "bServerSide": true,
                "sAjaxSource": "Home/AjaxHandler",
                "bProcessing": true,
                "aoColumns": [
                                { "sName": "FName"
                                    }
                                ,
                                { "sName": "LName" },
                                { "sName": "DeptID" }
                ]
            });
        });
    </script>

the following controller:-

    public ActionResult AjaxHandler(jQueryDataTableParamModel param)
    {
        var allCompanies = t.Emps;

        var result = allCompanies.Select(c=> new {c.FName, c.LName, c.DeptID});
                   //  select new[] {  };

        return Json(new
        {
            sEcho = param.sEcho,
            iTotalRecords = allCompanies.Count(),
            iTotalDisplayRecords = allCompanies.Count(),
            aaData = result.ToList()
        },
                        JsonRequestBehavior.AllowGet);
    }

and here is the view:-

<table id="myDataTable" class="display">
    <thead>
        <tr>
            <th>FName</th>
            <th>LName</th>
            <th>DeptID</th>

        </tr>
    </thead>
    <tbody></tbody>
</table> 

but when i run the application i got the following error and all the data will be displayed as null:-

DataTables warning: table id=myDataTable - Ajax error. For more information about this error, please see http://datatables.net/tn/7

DataTables warning: table id=myDataTable - Requested unknown parameter '0' for row 0. For more information about this error, please see http://datatables.net/tn/4

enter image description here

1
what does returned JSON look like for aData? Seems it doesn't match what you declared in column definitionscharlietfl
@charlietfl can you adivce more on this please ? now i am returning three columns from my action method, as defined inside the columns definition..john Gu
I think problem might be using old API docs to set up column definitions. Example from one of my projects: columns:[ { data: "id" }..charlietfl
using data instead of sName?charlietfl
lots of examples in the docs, as well as API is well documentedcharlietfl

1 Answers

1
votes

As stated you are using old initializers, try this instead

$('#myDataTable').dataTable({
    "serverSide": true,
    "ajax": "Home/AjaxHandler",
    "processing": true,
    "columns": [
                { "data": "FName"},
                { "data": "LName" },
                { "data": "DeptID" }
    ]
});