ASP.NET MVC 2和桌面v2 jQuery控件

Question

希望有人可以帮忙，我一直在玩ASP.NET MVC 2的学习项目。最近我想介绍一些更高级的效果，其中一个是可排序的表格。鉴于我有一些其他的jQuery控件，使用jQuery控件似乎是一个好主意！

我选择了tablesorter v2，并着手将其添加到我的网站。

1. 确保我的桌子我想要造型有thead/tbody部分。
2. 将.js文件添加到我的Scripts目录中。
3. 将此添加到我的局部视图<script src="<%= Url.Content("~/Scripts/jquery-ui-1.8.4.custom.min.js") %>" type="text/javascript"></script>
4. （如需资讯）也试图与在“的Site.Master”认为，进入顶。
5. 将id="leagueTable"添加到我的表中。
6. 将局部视图添加为<script type="text/javascript"> $(document).ready(function() { $("#leagueTable").tablesorter(); }); </script>。

在这个阶段，我跑了网站，一切都按预期工作 - 例如，我可以对内容进行排序，但没有什么可以改变的。现在添加CSS ....

1. 我下载了“blue.zip”并将其全部复制到/Content目录。
2. 将以下内容添加到Site.Master的顶部，<link href="<%= Url.Content("~/Content/style.css") %>" type="text/css" rel="stylesheet" />（NB。style.css是提供的CSS的名称 - 最初我将其重命名，但在出现问题后，我减少了更改以保持提供的状态）。

在这个阶段，我已重新运行（确保为Ctrl-F5到期任何缓存），并希望看到花哨的造型如图所示的例子...代替，而仍然正常工作，没有什么期待不同。

我在chrome中运行（使用Inspect元素工具），并确认CSS正在下载 - 正在应用jquery，因为我的排序功能正在工作 - 但它声称什么都没有在使用CSS（使用审计 - “style.css：100％（估计）未被当前页面使用”）。

我究竟做错了什么？为什么我没有得到应用的样式？ [20年的C++，实时领域，但新的网页开发]

Answer 1

那么解决方案，经过大量的狩猎和@Matt的方向后，结果是非常简单 - 但我已经仔细检查tablesorter documentation，发现它并没有在那里提及！

当您添加网站上提供的“蓝色”或“绿色”主题时，两个都需要为表格指定一个类名tablesorter。我错误地认为，jQuery（工作）将改变表结构添加自己的风格类匹配在主题中定义的类！

因此，要回顾：

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#leagueTable1").tablesorter(); 
     $("#leagueTable2").tablesorter(); 
    }); 
</script> 

<table id="leagueTable1"> 
    <thead> 
    ... // THIS TABLE WILL NOT BE STYLED 
</table> 
<table id="leagueTable2" class="tablesorter"> 
    <thead> 
    ... // THIS TABLE _WILL_ BE STYLED 
</table> 

Answer 2

我个人首选的方法来检查静态资源（如CSS文件）是否正确链接是做一个“查看源“在FireFox中。这个视图超链接CSS链接，所以你可以点击它并直接看到什么是或不正在下载。

不过，既然你提到浏览器，我这样做：

• 单击“控制当前页”按钮（右上角），然后选择“开发” - >“开发工具”

• 接下来，导航到头标记中的CSS源代码链接，然后单击CSS文件的链接，或者单击顶部的“Resources”菜单选项，该选项将列出页面上的所有资源，并导航到CSS文件

• 它可能告诉你，在这一点上你需要启用“资源跟踪” - 如果允许的话。您可以

• 一旦您导航到“资源”页面上的CSS文件，点击它。它会加载资源。如果它加载了预期的CSS，那么是的，它加载正确。

现在，让我们假定它是装载正确的，但你仍然有问题。我会尝试将你自己的自定义CSS样式添加到样式表中，并按照预期查看它是否正在更新页面。可以是简单的，如

table td{ font-weight: bold; } 

如果此样式有效，您知道正在应用样式表。

如果你仍然有问题，你能不能指导我们的页面（如果它是可公开访问的），或者准备什么不工作是在这样的网站http://jsbin.com/

邮回来的更新的例子，我会尽力解决你的问题。我自己使用了tablesorter，所以熟悉这个插件。