Hi, can someone help me with this piece of code. I want to use jQuery’s dataTable to change my existing table to a dataTable. After researching and working with tutorials I came up with the following but the script in the view does not get executed.
The issue appears to be with your selector. Selectors in jQuery follow the CSS syntax of prepending a "#" for ids and "." for classes. Since your table has a class of myTableId, your jQuery code should be:
$(".myTableId").dataTable();
rather than
$("myTableId").dataTable();
Marked as answer by AlexanderBlade on Jun 10, 2012 07:55 AM
AlexanderBla...
Member
325 Points
309 Posts
Why is my jQuery script not being executed. Please help!
Jun 08, 2012 01:58 AM|LINK
Hi, can someone help me with this piece of code. I want to use jQuery’s dataTable to change my existing table to a dataTable. After researching and working with tutorials I came up with the following but the script in the view does not get executed.
The Layout Page:
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
@RenderSection("PageScripts",false) <!--custom placeholder. each view will be able to put or CSS files that will br for that page only.-->
<link href ="../../Content/themes/base/jquery.ui.core.css" rel="Stylesheet" type="text/css" />
<link href="../../Content/themes/base/jquery.ui.datepicker.css")" rel="Stylesheet" type="text/css" />
<link href="../../Content/themes/base/jquery.ui.theme.css" rel="Stylesheet" type="text/css" />
<script src ="../../Scripts/jquery.ui.core.min.js" type ="text/javascript"></script>
<script src="../../Scripts/jquery.ui.datepicker.min.js" type ="text/javascript"></script>
<script src="../../Scripts/DatePickerReady.js" type ="text/javascript"></script>
</head>
Inside the view containing the table:
@model IEnumerable<SchoolIn.Models.Assignment>
@section PageScripts{
<link href="../../Content/themes/base/jquery.ui.core.css" type ="text/javascript" />
<link href="../../Content/dataTable/the_table.css" />
<script src="../../Scripts/DataTables-1.9.1/media/js/jquery.js" type="text/javascript"></script>
<script src="../../Scripts/DataTables-1.9.1/media/js/jquery.dataTables.js" type="text/javascript"/>
<script type="text/javascript">
$(document).ready(function () {
$("myTableId").dataTable();
});
</script>
}
A sample of my table:
<table class=" myTableId ">
<tr>
<th>
AppointmentNo
</th>
</table>
The sectionPagescripts does not get executed. What am I doing wrong?
asteranup
All-Star
30184 Points
4906 Posts
Re: Why is my jQuery script not being executed. Please help!
Jun 08, 2012 02:49 AM|LINK
Hi,
I am sure you are facing the file reference issue. Check the post below-
http://growingtech.blogspot.in/2012/06/ajax-data-paging-with-datatablesnet.html
This is done using server data paging. You can ignore the paging and use the normal one. At the end there is source code you can download.
Anup Das Gupta
Mark as Answer if you feel so. Visit My Blog
AlexanderBla...
Member
325 Points
309 Posts
Re: Why is my jQuery script not being executed. Please help!
Jun 08, 2012 03:58 AM|LINK
MrOBrian
Member
78 Points
9 Posts
Re: Why is my jQuery script not being executed. Please help!
Jun 08, 2012 08:02 PM|LINK
The issue appears to be with your selector. Selectors in jQuery follow the CSS syntax of prepending a "#" for ids and "." for classes. Since your table has a class of myTableId, your jQuery code should be:
$(".myTableId").dataTable();
rather than
$("myTableId").dataTable();
sivaguru
Member
36 Points
8 Posts
Re: Why is my jQuery script not being executed. Please help!
Jun 09, 2012 04:05 AM|LINK
You are using worng jQuery selector.
$(document).ready(function () { $("myTableId").dataTable(); });is wrong. Instead try the following
$(document).ready(function () { $(".myTableId").dataTable(); //<-- Selecting by class name });You can readd more about jQuery selectors here http://api.jquery.com/category/selectors/
Thanks
Siva
Marks as answer, if it helps you.