MVC Table sorting
I'm currently playing around with the Tablesorter jQuery plugin in one of the sites I'm working on. It seems to be fairly straight forward, but for some reason the headers don't sort. Clicking on them doesn't even produce any visible response (the cursor doesn't change). I suspect this may have something to do with the fact that the table is dynamic in that it is populated by data pulled from a database table (edit: confirmed that this is not the issue by testing using static, manually entered data). The other possibility is that my jQuery code is in the wrong location or there's a problem with my reference.
Any ideas?
The project is done in MVC, by the way.
View Page Source result:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1"><title>
Execution History
</title><link href="../Content/Site.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="~/Scripts/jquery-1.4.1.js"></script>
<script type="text/javascript" src="~/Scripts/jquery.tablesorter.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("table").tablesorter({
headers: {
8: {
sorter: false
},
9: {
sorter: false
}
}
});
});
</script>
</head>
<body>
<div class="page">
<div id="main">
<h2>Execution History</h2>
<table id="myTable" class="tablesorter">
<thead>
<tr>
<th>Run ID</th>
<th>Date Ran</th>
<th>Ran By</th>
<th>Run Time</th>
<th>Result</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>7/25/2011 11:25:01 AM</td>
<td>Laura</td>
<td>145.49849999696</td>
<td>PASS</td>
</tr>
<tr>
<td>2</td>
&l开发者_JAVA技巧t;td>8/3/2011 6:23:01 PM</td>
<td>Laura</td>
<td>140.616000004113</td>
<td>PASS</td>
</tr>
<tr>
<td>3</td>
<td>8/3/2011 6:26:00 PM</td>
<td>Laura</td>
<td>141.592500001192</td>
<td>PASS</td>
</tr>
<tr>
<td>4</td>
<td>8/4/2011 8:04:00 PM</td>
<td>Kevin</td>
<td>260.725500002503</td>
<td>FAIL</td>
</tr>
<tr>
<td>5</td>
<td>10/5/2011 4:05:50 PM</td>
<td>Kevin</td>
<td>2749796.658</td>
<td>PASS</td>
</tr>
<tr>
<td>6</td>
<td>10/5/2011 5:31:18 PM</td>
<td>Kevin</td>
<td>2777489.2215</td>
<td>PASS</td>
</tr>
</tbody>
</table>
<div id="footer"></div>
</div>
</div>
</body>
</html>
Found the solution. It was indeed a file reference problem. The code works fine on localhost, but I do most of my testing on IIS since this is a deployed site. Thus, a mapping is required for IIS to actually find the referenced jquery scripts. Url.Content does exactly this.
<script src="<%=Url.Content("~/Scripts/jquery-1.4.1.js") %>" type="text/javascript"></script>
精彩评论