I'm working with ASP.Net MVC and Bootstrap, which I'm fairly new to, and I'm trying to use DataTables on a page I'm working on.
我使用ASP。Net MVC和Bootstrap，这是我刚接触过的，我正在尝试在我正在开发的页面上使用DataTables。
I'm getting the above error on a page with which I'm trying to use DataTables. I've seen the reference to this error in the DataTables FAQ, but it doesn't seem to apply (I've tried using both "DataTable()" (which it recommended) and "dataTable()".
在我尝试使用DataTables的页面上，我得到了上面的错误。我在DataTables FAQ中看到了对这个错误的引用，但它似乎并不适用(我尝试使用了两个“DataTable()”)(它推荐)和“dataTable()”。
I've found a number of people reporting the same error on google, and have tried their solutions without any success.
我发现有许多人在谷歌上报告了相同的错误，并且尝试了他们的解决方案而没有取得任何成功。
I've tried looking at the source for a number of DataTables examples, and am not seeing anything significantly different. I've tried moving the script imports to the head instead of the body (where the ASP.Net MVC template puts them), but that didn't help.
我已经尝试了一些DataTables示例的源代码，并没有看到任何明显不同的东西。我已经尝试将脚本导入到头部而不是主体(ASP在那里)。Net MVC模板，但这并没有帮助。
At this point I suspect I'm doing something forehead slappingly simple wrong in my HTML, or I've not imported something properly into the project (I have the standard MVC imports that visual studio brings in to a new project, and I've used nuget to pull in the DataTables package - the referenced DataTables files all exist in the solution).
在这一点上我觉得我做错额头拍打简单的事情在我的HTML,或者我不能正常进口东西到项目(我有标准的MVC进口visual studio带来一个新项目,我使用nuget拉在datatable包——datatable中引用的文件都存在于解决方案)。
The HTML, as it is rendered when the error occurs is shown below. I've tried this using IE11 and the latest version of Chrome - Chrome appears to swallow the error, but doesn't format the table using DataTables. IE causes visual studio to break execution with the error.
当出现错误时，HTML将显示在下面。我已经尝试过使用IE11和最新版本的Chrome浏览器，但它并没有使用DataTables来格式化表格。IE导致visual studio以错误的方式中断执行。
Here's the HTML - I've removed all but a single row from the table and anonymised some strings, but other than that this is the HTML being generated - can anyone point me in the right direction? Apologies if I've missed something obvious I could have done myself - still quite new to this sort of development
这里是HTML——我已经删除了表中的所有一行，并匿名化了一些字符串，但除此之外，这是生成的HTML——有人能指出我的正确方向吗?如果我错过了一些我本可以做的事情——这对这种发展来说仍然是全新的，我很抱歉。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Index</title>
<link href="/Content/bootstrap.css" rel="stylesheet"/>
<link href="/Content/site.css" rel="stylesheet"/>
<script src="/Scripts/modernizr-2.8.3.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>
<a class="navbar-brand" href="/">Test</a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="/">Home</a></li>
<li><a href="/Home/About">About</a></li>
<li><a href="/Home/Contact">Contact</a></li>
</ul>
<form action="/Account/LogOff" class="navbar-right" id="logoutForm" method="post"><input name="__RequestVerificationToken" type="hidden" value="Ff0UsQuoy8REoB06X9xf2I9jPyOLtk4Zt0MpV_TXcNQH92nZqfEWckTr5ameIPT2MZTwgzNkBv5AMJQG3XlZIxQ34DMhE73k141n7RGjyqtzxPj0T-54wwSAZ1IyNdb0eFumyB4egq6ZPotYae5M5Q2" /> <ul class="nav navbar-nav navbar-right">
<li>
<a href="/Manage" title="Manage">Hello Kev!</a>
</li>
<li><a href="javascript:document.getElementById('logoutForm').submit()">Log off</a></li>
</ul>
</form>
</div>
</div>
</div>
<div class="container body-content">
<h2>Index</h2>
<h4>Pending Deliveries (POD not uploaded)</h4>
<table class="table" id="jobs">
<tr>
<th>Company</th>
<th>Job</th>
<th>Deliver To</th>
<th>Assigned to you</th>
<th>Driver/Vehicle</th>
<th></th>
</tr>
<tr>
<td>
Test
</td>
<td>
DR53941
</td>
<td>
Dublin
</td>
<td>
04/05/2005 15:45:00
</td>
<td>
</td>
<td>
<a href="/HaulierHome/UploadPOD/00ad79c9-cff5-4276-a1b8-bd16efdc2cb5">Upload POD</a>
<a href="/HaulierHome/Assign/00ad79c9-cff5-4276-a1b8-bd16efdc2cb5">Assign</a>
</td>
</tr>
</table>
<hr />
<footer>
<p>© 2015 - Test</p>
</footer>
</div>
<script src="/Scripts/jquery-2.1.4.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/respond.js"></script>
<link href="/Content/DataTables/css/jquery.dataTables.min.css" rel="stylesheet" type="text/css" />
<script src="/Scripts/DataTables/jQuery.dataTables.min.js"></script>
<script>
$(document).ready(function () { $('#jobs').DataTable(); });
</script>
<!-- Visual Studio Browser Link -->
<script type="application/json" id="__browserLink_initializationData">
{"appName":"Internet Explorer","requestId":"d6cc4bfd70744a668b895798732a7b1b"}
</script>
<script type="text/javascript" src="https://localhost:44399/db2a5633ea9f42c996d29ff040a87ecb/browserLink" async="async"></script>
<!-- End Browser Link -->
</body>
</html>The full error I get is 0x800a01b6 - JavaScript runtime error: Object doesn't support property or method 'DataTable'. The relevant line in the HTML is the $(document).ready script line near the bottom
我得到的全部错误是0x800a01b6 - JavaScript运行时错误:对象不支持属性或方法“DataTable”。HTML中的相关行是$(文档)。准备好的脚本在底部附近。
1 个解决方案
#1
0
Not sure why it helped, but I've solved this. I removed the DataTables references from the script section and added the following to the BundleConfig file
不知道为什么会有帮助，但我已经解决了。我从脚本部分删除了DataTables引用，并将以下内容添加到BundleConfig文件中。
bundles.Add(New ScriptBundle("~/bundles/bootstrap").Include( "~/Scripts/bootstrap.js", "~/Scripts/respond.js", "~/Scripts/DataTables/jQuery.dataTables.min.js"))
包。添加(新ScriptBundle(“~ /包/引导”)。包括(“~ /脚本/引导。js”、“~ /脚本/回应。js”、“~ /脚本/ datatable / jQuery.dataTables.min.js”))
bundles.Add(New StyleBundle("~/Content/css").Include( "~/Content/bootstrap.css", "~/Content/site.css", "~/Content/DataTables/css/jquery.dataTables.min.css"))
包。添加(新StyleBundle(~ /内容/ css)。包括(“~ /内容/引导。css”、“~ /内容/网站。css”、“~ /内容/ datatable / css / jquery.dataTables.min.css "))
In case anyone else is getting the same error it might be worth giving this a try?
如果其他人也有同样的错误，不妨试试?
#1
0
Not sure why it helped, but I've solved this. I removed the DataTables references from the script section and added the following to the BundleConfig file
不知道为什么会有帮助，但我已经解决了。我从脚本部分删除了DataTables引用，并将以下内容添加到BundleConfig文件中。
bundles.Add(New ScriptBundle("~/bundles/bootstrap").Include( "~/Scripts/bootstrap.js", "~/Scripts/respond.js", "~/Scripts/DataTables/jQuery.dataTables.min.js"))
包。添加(新ScriptBundle(“~ /包/引导”)。包括(“~ /脚本/引导。js”、“~ /脚本/回应。js”、“~ /脚本/ datatable / jQuery.dataTables.min.js”))
bundles.Add(New StyleBundle("~/Content/css").Include( "~/Content/bootstrap.css", "~/Content/site.css", "~/Content/DataTables/css/jquery.dataTables.min.css"))
包。添加(新StyleBundle(~ /内容/ css)。包括(“~ /内容/引导。css”、“~ /内容/网站。css”、“~ /内容/ datatable / css / jquery.dataTables.min.css "))
In case anyone else is getting the same error it might be worth giving this a try?
如果其他人也有同样的错误，不妨试试?