I\'m a noob to MVC, jquery and DataTables. I get a Microsoft Visual Studio warning dialog when I hit F5 to build and bring up the site locally for development/debug:
OK,
Remove the {} between the () of the datatable
write like this
$(document).ready(function () {
$('#table_id').dataTable();
});
Fiddle example
When you want to add options to the datatable you use the {} in order to consume the options
like this:
$(document).ready(function() {
$('#example').dataTable( {
"bPaginate": false,
"bLengthChange": false,
"bFilter": true,
"bSort": false,
"bInfo": false,
"bAutoWidth": false
} );
} );
See example
Since you mention that you are a newbie (i dont like the word noob) in MVC and such, I assume that you declared jQuery in more than one Views (like you did above). I am providing an example layout for you code, if you wish to follow it
jQuery and any other libraries, should only be included in your html only once, ideally at the bottom of the page, just before the body closing tag
If at later point in your code, you are including jQuery again, then it will overwrite the previous one, which has the dataTable plugin attached to it
Best to check in an actual browser (chrome,firefox,IE) instead of Visual Studio. In Chrome, press F12 to bring up the Developer Tools, then press Esc to bring up the console. See any errors there?
An example layout for your code could look like this. This is the master view file (If i am not mistaken, by default its in Views > Shared > _Layout.cshtml)
<!DOCTYPE html>
<html>
<head>
...
<!-- Global Styles -->
<link href="styles.css" rel="stylesheet" type="text/css" />
<!-- Page Specific Styles -->
@if (IsSectionDefined("Styles"))
{
@RenderSection("Styles")
}
...
</head>
<body>
...
<!-- Global Scripts -->
<script src="@Url.Content("~/Scripts/jquery-1.8.3.js")" type="text/javascript"></script>
<!-- Page Specific Scripts -->
@if (IsSectionDefined("Scripts"))
{
@RenderSection("Scripts")
}
</body>
</html>
And you can add any specific styles/scripts you want to each view, like so
...
<!-- View HTML -->
...
@section Styles {
<link href="specific.css" />
}
@section Scripts {
<script src="specific.js"></script>
}
Hope it helps
I think you may have a try to comment these lines out:
@Scripts.Render("~/bundles/jquery")
@RenderSection("scripts", required: false)
which are at the end of "_Layout.cshtml" page.
Hope it makes sense