AJAX Source no binding to jquery datatable in mvc asp.net

AJAX Source no binding to jquery datatable in mvc asp.net

JbrittoJbritto Posts: 3Questions: 2Answers: 0
edited August 2017 in Free community support

Hi there: I'm having an AJAX error : Datatables warning: TableId= tbprojectmanager" AJAX error. I checked the class properties and references ...everything seems to be fine. I assumen that is JSON formatting error? Please assist I don't know where is the mistake .....
Thanks in advance

Jose

references at the master page

 @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")
    @RenderSection("scripts", required: false)
    <script type="text/javascript" charset="utf8" src="http://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>
    <link rel="stylesheet" type="text/css" href="http://cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css">

Public class Project Manager

         public int ProjectManagerID { get; set; }
        public string Name { get; set; }
        public string Surname { get; set; }
        public string Office { get; set; }
         public string Email { get; set; }
         public string Telephone { get; set; }
         public string Cellphone { get; set; }
         public DateTime ? CreatedDate { get; set; }
        public string CreatedBy { get; set; }
        public DateTime ? UpdatedDate { get; set; }
        public string UpdatedBy { get; set; }

Controller:

 [HttpGet]
    public JsonResult getProjectManagers()
    {
        using (BudgetsouthContext dc = new BudgetsouthContext())
        {
            var employees = dc.projectmanagers.OrderBy(a => a.Name).ToList();
            return Json(new { data = employees }, JsonRequestBehavior.AllowGet);
        }
    }
 <script type="text/javascript">
    $(document).ready(function () {

        $("#tbprojectmanager").DataTable({
            "ajax": {
                "url": "ProjectManagers/getProjectManagers",
                "tye": "GET",
                "datatype": "json",
            },
            "columns": [
                        { "data": "Name", "autowidth": true },
                        { "data": "Surname", "autowidth": true },
                        { "data": "Office", "autowidth": true },
                        { "data": "Email", "autowidth": true },
                        { "data": "Telephone", "autowidth": true },
                         { "data": "Cellphone", "autowidth": true },
                        { "data": "CreatedDate", "autowidth": true },
                        { "data": "CreatedBy", "autowidth": true },
                        { "data": "UpdatedDate", "autowidth": true },
                        { "data": "UpdatedBy", "autowidth": true }

            ]
        });

    });

    </script>

HTML

    <div style="width:400px; margin:0 auto">
        <table id="tbprojectmanager" class="display" cellspacing="0" data-page-length='5'>
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Surname</th>
                    <th>Office</th>
                    <th>Email</th>
                    <th>Telephone</th>
                    <th>Created by</th>
                    <th>Updated on</th>
                    <th>Updated by</th>
                </tr>
            </thead>
        </table>
    </div>

Edited by Allan - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

Answers

  • tangerinetangerine Posts: 3,365Questions: 39Answers: 395
     "tye": "GET"
    

    That's "type".
    Otherwise, what error is shown in your browser console?

  • allanallan Posts: 63,471Questions: 1Answers: 10,467 Site admin

    What is the data that is being returned by the server?

    Allan

This discussion has been closed.