Question

这是关于这个问题的后续问题： ASP.NET Gridview tablesorter with fixed header

我认为最能回答这个问题的人是用户Mottie。我一直试图联系他，但没有运气。

所以我的问题是我正在尝试使用tablsorter插件对表进行排序，并使表可滚动。排序部分工作得很好，但我还没有设法启用滚动。

如果您之前从未使用过插件，那么文档就不是很清楚了。没有可用的视频教程。我只能找到排序部分的教程。

有人可以帮我一些基本步骤，我需要做些什么才能启用滚动条？

我制作了一个新的asp.net网络表单应用。这是一个全新的清洁项目。我添加了一个简单的表与thead和tbody。我添加了列和行。该表具有class =“tablesorter”。我引用了以下外部文件：

<link rel="stylesheet" type="text/css" href="css/tablesorter.css"/>
<script type="text/javascript" src="Scripts/jquery-latest.js"></script> 
<script type="text/javascript" src="Scripts/jquery.tablesorter.js"></script>
<script type="text/javascript" src="Scripts/jquery.tablesorter-widgets.js"></script>
<script type="text/javascript" src="Scripts/widgets/widget-scroller.js"></script> 

<script type="text/javascript">
    $(function (){
        $("table").tablesorter({
            widgets: ['scroller'],
            widgetOptions: {
                scroller_height: 300,
                scroller_barWidth: 17,
                scroller_jumpToHeader: true}
        });
    });
</script>

我在文档中添加了这些功能。它不起作用。我正在使用tablesorter版本2.28.15

更新

在玩代码时，我删除了所有的css，除了引用脚本之外我唯一使用的代码是：

<script type="text/javascript">
    $(document).ready(function ()
    {
        $("table").tablesorter({
            theme: 'dark',
            headerTemplate: '{content} {icon}',
            widgets: ['uitheme', 'scroller'],
            widgetOptions: {
                scroller_upAfterSort: true,
                scroller_jumpToHeader: true,
                scroller_height: 300,
                scroller_barWidth: 17
            }
        });
    });
</script>

当我点击其中一个表格列时，它会在第一个列顶部呈现另一个标题。它在右侧渲染一个滚动滑块，它将表的高度更改为300.

太好了！这意味着它可以工作，但为什么它不从头开始渲染滑块，只有在我点击表头时才有效？此外..每次我点击表格标题时都会发生这种情况。所以，如果我点击5次，我将有5个表格标题和5个滑块。

为什么会这样？

Tablesorter滚动条无效

0 个答案: