Как связать JSON данные с jQuery данными?

Question

У меня есть простой класс для получения данных всех сотрудников из базы данных с помощью хранимой процедуры. Код весь в ASP. NET MVC. Он даже возвращает JSON данные в необработанном виде, но не связывается с jQuery Datatable.

Вот мой код контроллера:

public JsonResult GetEmployees()
        {
            string cs = ConfigurationManager.ConnectionStrings["DBCS"].ConnectionString;
            List<Employee> employees = new List<Employee>();
            using (SqlConnection con = new SqlConnection(cs))
            {
                SqlCommand cmd = new SqlCommand("SP_GETEMPLOYEES", con);
                cmd.CommandType = CommandType.StoredProcedure;
                con.Open();
                SqlDataReader rdr = cmd.ExecuteReader();
                while (rdr.Read())
                {
                    Employee employee = new Employee();
                    employee.EMPLOYEE_ID = Convert.ToInt32(rdr["EMPLOYEE_ID"]);
                    employee.FIRST_NAME = rdr["FIRST_NAME"].ToString();
                    employee.LAST_NAME = rdr["LAST_NAME"].ToString();
                    employee.EMAIL = rdr["EMAIL"].ToString();
                    employee.PHONE_NUMBER = rdr["PHONE_NUMBER"].ToString();
                    employee.HIRE_DATE = Convert.ToDateTime(rdr["HIRE_DATE"]); //rdr["WebSite"].ToString();
                    employee.JOB_ID =Convert.ToInt32(rdr["JOB_ID"]) ;
                    employee.SALARY = Convert.ToInt32(rdr["SALARY"]);

                    employee.MANAGER_ID = (rdr["MANAGER_ID"] as int?).GetValueOrDefault();

                        employee.DEPARTMENT_ID = Convert.ToInt32(rdr["DEPARTMENT_ID"]);
                    //Convert.ToDateTime(rdr["HireDate"]);
                    employees.Add(employee);
                }
            }

            return Json(new{data=employees},JsonRequestBehavior.AllowGet);


        }

А вот мой просмотр со скриптом для привязки к dataTable. :

@model Employee_Management_System.Models.Employee

@{
    ViewBag.Title = "GetEmployees";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>GetEmployees</h2>
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>
<script type="text/javascript" charset="utf8" src="http://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>
@*<script src="~/Scripts/DataTables/jquery.dataTables.js"></script>*@
<link rel="stylesheet" type="text/css" href="~/Content/DataTables/css/jquery.dataTables.css">




<div class="dropdown-menu" style="">
    <a class="dropdown-item" href="#">Action</a>
    <a class="dropdown-item" href="#">Another action</a>
    <a class="dropdown-item" href="#">Something else here</a>
    <div class="dropdown-divider"></div>
    <a class="dropdown-item" href="#">Separated link</a>
</div>

<div>
    <table class="table table-hover" id="tblEmployee">
        <thead>
        <tr class="table-primary">
            <th scope="row">EMPLOYEE_ID</th>
            <th scope="row">FIRST_NAME</th>
            <th scope="row">LAST_NAME</th>
            <th scope="row">EMAIL</th>
            <th scope="row">PHONE_NUMBER</th>
            <th scope="row">HIRE_DATE</th>
            <th scope="row">JOB_ID</th>
            <th scope="row">SALARY</th>
            <th scope="row">MANAGER_ID</th>
            <th scope="row">DEPARTMENT_ID</th>
        </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
    <script src="~Scripts/jquery-1.11.3.min.js"></script>
    <script src="~Scripts/jquery.dataTables.js"></script>
    <link href="css/jquery.dataTables.min.css" rel="stylesheet" />
    <script type="text/javascript">
        $(document).ready(function () {
            $('#tblEmployee').DataTable({
                "searching": true,
                "ordering": true,
                "pagingType": "full_numbers",
                "ajax": "https://localhost:44359/Employee/GetEmployees",
                "columns": [
                    { 'data': 'EMPLOYEE_ID' },
                    { 'data': 'FIRST_NAME' },
                    { 'data': 'LAST_NAME' },
                    { 'data': 'EMAIL' },
                    { 'data': 'PHONE_NUMBER' },
                    { 'data': 'HIRE_DATE' },
                    { 'data': 'JOB_ID' },
                    { 'data': 'SALARY' },
                    { 'data': 'MANAGER_ID' },
                    { 'data': 'DEPARTMENT_ID' }
                ],
                "success": function (data) {
                    $('#tblEmployee tbody').empty();
                    $('#tblEmployee tbody').append(data);
                }
            });
        });
    </script>
</div>
@*<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>
<script type="text/javascript" charset="utf8" src="http://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>*@
@*<script>
        $(function () {
            $("#tblEmployee").DataTable();
        })
    </script>*@

Я не могу расшифровать, где я ошибаюсь? Очень новичок в этом jQuery. RAW Json Данные