why jquery dataTable not display data

Question

Im Getting Error as http://localhost:47237/Home_Business/Home_Business/GetData?draw=1&columns%5B0%5D%5Bdata%5D=Emp_Id&columns%5B0%5D%5Bname%5D=&columns%5B0%5D%5Bsearchable%5D=true&columns%5B0%5D%5Borderable%5D=true&columns%5B0%5D%5Bsearch%5D%5Bvalue%5D=&columns%5B0%5D%5Bsearch%5D%5Bregex%5D=false&columns%5B1%5D%5Bdata%5D=EmpName&columns%5B1%5D%5Bname%5D=&columns%5B1%5D%5Bsearchable%5D=true&columns%5B1%5D%5Borderable%5D=true&columns%5B1%5D%5Bsearch%5D%5Bvalue%5D=&columns%5B1%5D%5Bsearch%5D%5Bregex%5D=false&columns%5B2%5D%5Bdata%5D=Email&columns%5B2%5D%5Bname%5D=&columns%5B2%5D%5Bsearchable%5D=true&columns%5B2%5D%5Borderable%5D=true&columns%5B2%5D%5Bsearch%5D%5Bvalue%5D=&columns%5B2%5D%5Bsearch%5D%5Bregex%5D=false&order%5B0%5D%5Bcolumn%5D=0&order%5B0%5D%5Bdir%5D=asc&start=0&length=10&search%5Bvalue%5D=&search%5Bregex%5D=false&_=1512374513133

here im trying to loading data in jqueryData Table insted of showing data in tabler Format its showing in Json Like

{"iTotalRecords":12,"aaData":[{"Emp_Id":101,"EmpName":"Hussain","Email":"Hussain@gmail.com","Psw":null,"Cnt_Id":0,"Cnt_Name":"India","Sts_Id":0,"Sts_Name":"Telangana","City_Id":0,"City_Name":"Hyd","dept_ID":null,"Date":"\/Date(1420050600000)\/","sal":15000,"Gen_Id":null,"Gen_Name":null}]}

Mvc code

 public ActionResult Index()
        {
            var x = ObjRepo.GetEmployees(1);
            int size =ObjRepo.CountEmployee();
           return Json(new { iTotalRecords = size, aaData }, JsonRequestBehavior.AllowGet);

        }

Jquery

 $(document).ready(function () {
        $('#table_id').dataTable({
//Here i Hotcoded my data Even imm not dusplay data
            "iTotalRecords":12,"aaData":[{"Emp_Id":101,"EmpName":"Hussain","Email":"Hussain@gmail.com"
            }],
            "processing": true,
            "serverSide": true,
            "Columns": [
                         { 'data': 'Emp_Id' },
                         { 'data': 'EmpName' },
                         ],
        });
    })

rjps12 rjps12 · Accepted Answer · 2017-12-04T08:25:56

you can do something like this inside a function or in document ready..

     $.ajax({
        type: 'GET',
        url: '@Url.Action("GetEmployees", "ControllerName")',
        cache: false,
        success: function (result) {
            $("#table_id").DataTable({
                destroy: true,
                data: result,
                columns: [
                    { data: 'employee_id' },
                    { data: 'employee_name' }
                ]
            });
        }
    });

then you need to have html table with thead on your #table_id

Controller:

[HttpGet]
public ActionResult GetEmployees()
{
     var x = ObjRepo.GetEmployees(1);
     int size =ObjRepo.CountEmployee();
     return Json(new { iTotalRecords = size, aaData }, JsonRequestBehavior.AllowGet);
}

why jquery dataTable not display data

1 Answers