Answered by:
Uncaught TypeError: Cannot read property 'mData' of undefined

Question
-
User81789783 posted
i m getting above mentioned error on below view page in mvc
@model IEnumerable<CallCenterCRM.Models.EmpDeptViewModel> @{ ViewBag.Title = "Index"; } <h2>Index</h2> <p> @Html.ActionLink("Create New", "Create") </p> <table id="table_id" class="table table-condensed table-striped table-hover"> <thead> <tr> <th> @Html.DisplayNameFor(model => model.Department) </th> <th> @Html.DisplayNameFor(model => model.Abbreviation) </th> <th> @Html.DisplayNameFor(model => model.prefix) </th> <th> @Html.DisplayName("Dept incharge") </th> </tr> </thead> <tbody> @foreach (var item in Model) { <tr> <td> @Html.DisplayFor(modelItem => item.Department) </td> <td> @Html.DisplayFor(modelItem => item.Abbreviation) </td> <td> @Html.DisplayFor(modelItem => item.prefix) </td> <td> @Html.DisplayFor(modelItem => item.SelectedEmployee) </td> </tr> } </tbody> </table> @section scripts{ <script> $(document).ready(function () { $("#table_id").DataTable({ "pagingType": "full_numbers", columns: [ { data: null, className: "center", defaultContent: '<a href="" class="editor_edit">Edit</a> / <a href="" class="editor_remove">Delete</a>' } ] }); }); $('#table_id').on('click', 'a.editor_edit', function (e) { e.preventDefault(); editor.edit( $(this).closest('tr'), { title: 'Edit record', buttons: 'Update' } ); } ); </script> }
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>@ViewBag.Title - My ASP.NET Application</title> @Styles.Render("~/Content/css") @Styles.Render("~/Content/themes/base/css") @Scripts.Render("~/bundles/modernizr") @Scripts.Render("~/bundles/jquery") @Scripts.Render("~/bundles/jqueryval") @Scripts.Render("~/bundles/jqueryui") @*@Scripts.Render("~/bundles/bootstrap")*@ <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <link href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" rel="stylesheet" /> <link href="https://cdn.datatables.net/buttons/1.5.1/css/buttons.dataTables.min.css" rel="stylesheet" /> <script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/pdfmake.min.js"></script> @*//code.jquery.com/jquery-1.12.4.js*@ @*<script src="https://cdn.datatables.net/buttons/1.5.1/js/dataTables.buttons.min.js"></script>*@ <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script> @*<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.0.1/js/buttons.colvis.min.js"></script>*@ <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/pdfmake.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/vfs_fonts.js"></script> @*<script src=" https://cdn.datatables.net/buttons/1.5.1/js/buttons.html5.min.js"></script>*@ <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <script src="~/Scripts/jquery-ui.js"></script> </head> <body> <div class="navbar navbar-inverse navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> @Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" }) </div> <div class="navbar-collapse collapse"> <ul class="nav navbar-nav"> <li>@Html.ActionLink("Home", "Index", "Home")</li> <li>@Html.ActionLink("About", "About", "Home")</li> <li>@Html.ActionLink("Contact", "Contact", "Home")</li> </ul> @*@Html.Partial("_LoginPartial")*@ </div> </div> </div> <div class="container body-content"> @RenderBody() <hr /> <footer> <p>© @DateTime.Now.Year - My ASP.NET Application</p> </footer> </div> @RenderSection("scripts", required: false) </body> </html>
detail error is below
Uncaught TypeError: Cannot read property 'mData' of undefined
at HTMLTableCellElement.<anonymous> (jquery.dataTables.min.js:89)
at Function.each (jquery-1.12.4.js:370)
at jQuery.fn.init.each (jquery-1.12.4.js:137)
at HTMLTableElement.<anonymous> (jquery.dataTables.min.js:89)
at Function.each (jquery-1.12.4.js:370)
at jQuery.fn.init.each (jquery-1.12.4.js:137)
at jQuery.fn.init.m [as dataTable] (jquery.dataTables.min.js:82)
at jQuery.fn.init.h.fn.DataTable (jquery.dataTables.min.js:164)
at HTMLDocument.<anonymous> (index:252)
at fire (jquery-1.12.4.js:3232)Sunday, February 11, 2018 9:17 AM
Answers
-
User81789783 posted
i remove this and working fine
columns: [ { data: null, className: "center", defaultContent: '<a href="" class="editor_edit">Edit</a> / <a href="" class="editor_remove">Delete</a>' } ]
- Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
Monday, February 12, 2018 2:59 AM