标签: tablesorter

Tablesorter示例不起作用

这应该工作:

<head>
    <title>Damn</title>
    <script src="jquery-latest.js" type="text/javascript"/>
    <script src="jquery.tablesorter.min.js" type="text/javascript"/>
    <script type="text/javascript">
    $(document).ready(function() {      
        $("#tablesorter-demo").tablesorter();
    }); 
</script>
</head>
<body>
    <table id="tablesorter-demo" class="tablesorter" border="2" cellpadding="0" cellspacing="1">
    <thead>
        <tr>
            <th>First Name</th>
            <th>Last Name</th>
            <th>Age</th>
            <th>Total</th>
            <th>Discount</th>
            <th>Difference</th>
            <th>Date</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Peter</td>

            <td>Parker</td>
            <td>28</td>
            <td>$9.99</td>
            <td>20.9%</td>
            <td>+12.1</td>
            <td>Jul 6, 2006 8:14 AM</td>

        </tr>
        <tr>
            <td>John</td>
            <td>Hood</td>
            <td>33</td>
            <td>$19.99</td>
            <td>25%</td>

            <td>+12</td>
            <td>Dec 10, 2002 5:14 AM</td>
        </tr>
        <tr>
            <td>Clark</td>
            <td>Kent</td>
            <td>18</td>
            <td>$15.89</td>
            <td>44%</td>
            <td>-26</td>
            <td>Jan 12, 2003 11:14 AM</td>
        </tr>
    </tbody>
    </table>
</body> …
Run Code Online (Sandbox Code Playgroud)

jquery tablesorter

1
推荐指数
1
解决办法
6154
查看次数

jQuery过滤和表格排序 - 如何查看"内部"html标签

我正在使用tablesorter库.我的问题是我的表格内的单元格中的每个项目都是一个链接,并且库开始错误地排序,因为它正在查看单元格内的HTML而不是文本.换句话说,在以下单元格内容中;

<a href="ledger.php?var=345345">$100.64</a> 它排序:

<a href="ledger.php?var=345345"> 代替 $100.64

我知道有办法查看单元格内的文本.我开始用他们在网站上列出的简单方法,文本提取方法.但是,我不能为我的生活让这个功能正常.

使用我的JS代码,任何人都可以告诉我如何正确应用此文本提取?这就是我现在所拥有的(下图).

当"文本提取"行没有被注释掉时,此代码的当前结果是插件无法加载,并且页面上的所有jQuery都失败了.Web开发人员插件中的控制台错误是:

错误:node.childNodes [0] .childNodes [0]未定义源文件:

$(document).ready( function () {
            // TableSorter
                $("#dt-results") 
                .tablesorter({
                                widgets: ['zebra'], 
                                sortList: [[0,1]],

                                // define a custom text extraction function 
                                textExtraction: function(node) { 
                                    // extract data from markup and return it  
                                    return node.childNodes[0].childNodes[0].innerHTML; 
                                } 
                })
                .tablesorterPager({container: $("#pager")})
                .tablesorterFilter({filterContainer: $("#filter-box"),
                              filterClearContainer: $("#filter-clear-button"),
                              filterCaseSensitive: false,
                              filterWaitTime: 100});
        });
Run Code Online (Sandbox Code Playgroud)

谢谢

jquery tablesorter

1
推荐指数
1
解决办法
882
查看次数

jQuery表格分类器浮动距离的排序

我正在使用tablesorter对表内容进行排序.我的表格如下.

<table class="results" border="1">
<thead>
    <tr>
        <th class="header">No</th> 
        <th class="header">Distance</th>
        <th class="header">Diagnostic Fee</th>
        <th class="header">Regular Price </th>
        <th class="header">Company Price</th>
        <th class="">&nbsp;</th>
    </tr>
</thead>

<tbody>
    <tr>
        <td>1</td>
        <td class="distance"><a>16.50 kms.</a></td>
        <td class="brand"><a>Credited</a></td>
        <td><a>$5</a></td>
        <td><a>$5<small>after 5% cash back</small></a></td>
    </tr>
    <tr>
           <td>2</td>
        <td class="distance"><a>6.30 kms.</a></td>
        <td class="brand"><a>Credited</a></td>
        <td><a>$8</a></td>
        <td><a>$8<small>after 5% cash back</small></a></td>
    </tr>
    <tr>
        <td>3</td> 
        <td class="distance"><a>10.25 kms.</a></td>
        <td class="brand"><a>Credited</a></td>
        <td><a>$2</a></td>
        <td><a>$2<small>after 5% cash back</small></a></td>
    </tr>
</tbody>
</table>?
Run Code Online (Sandbox Code Playgroud)

我想用距离和价格对表格进行排序.我面临的困难是用距离解决桌子,因为距离以字母数字显示,如"12公里".所以,表格没有排序.

任何人都可以建议如何只通过数字解析内容?

这是jsfiddle演示

javascript jquery tablesorter

1
推荐指数
1
解决办法
858
查看次数

使用 Tablesorter 使用 Ajax 刷新表

我有一个正在使用 AJAX 刷新的表。我想将 TableSorter 应用于此表。

我是 jQuery 的新手。从 AJAX 成功返回后,我是这样做的:

   success: function(html)
        {
        jQuery("#animalsinexhibit").html(html);
            jQuery("#animalsinexhibit").tablesorter({
                   debug          : true,
                   widgets        : ['zebra', 'columns'],
                   usNumberFormat : false,
                   sortReset      : true,
                   sortRestart    : true
           });
        },
Run Code Online (Sandbox Code Playgroud)

当页面最初显示时(即第一次从 AJAX 调用返回),这工作正常,但第二次 AJAX 返回时,我得到以下信息并且没有出现 TableSort 样式和标题排序图标:

stopping initialization! No table, thead, tbody or tablesorter has already been initialized
Run Code Online (Sandbox Code Playgroud)

我也尝试使用以下方法但没有成功:

var resort = true;
jQuery("#animalsinexhibit").trigger("update", [resort]);
Run Code Online (Sandbox Code Playgroud)

在 AJAX 数据上附加 TableSorter 的正确方法是什么?

谢谢。

ajax tablesorter

1
推荐指数
1
解决办法
6922
查看次数

tablesorter 和选择/下拉框

我正在使用 tablesorter ( http://mottie.github.io/tablesorter/docs/index.html ) 并且我的一个表有一个下拉选择框。

通过下面的文本提取,我设法按所选选项对其进行排序。但是,这只适用于初始选择。如果我更改任何选项并对表格重新排序,它仍然使用旧值。

如何教 tablesorter 使用当前选定的值?

    textExtraction: function(node) {
        // Check if option selected is set
        if ($(node).find('option:selected').text() != "") {
            return $(node).find('option:selected').text();
        }
        // Otherwise return text
        else return $(node).text();
    }
Run Code Online (Sandbox Code Playgroud)

jquery tablesorter

1
推荐指数
1
解决办法
3364
查看次数

jQuery的.click()事件停止了工作

我有一个表,每行的第一列包含几个图标,每个图标在一个元素内:

<a title="aaa@aaa.es" class="delete" href="#" data-toggle="modal" data-target="#dialogDeleteUser">
    <img alt="delete" src="/recursos/imagenes/iconPapelera.png">
</a>
Run Code Online (Sandbox Code Playgroud)

我有一个jQuery函数,应该在单击该链接时触发:

$(document).ready(function(){
    $("a.delete").click(function() {
        var userEmail = $(this).attr("title");
        loadUserDelete(userEmail);
    });
Run Code Online (Sandbox Code Playgroud)

事实上它已经工作了一段时间,直到我开始使用Pager小部件和Ajax开始使用TableSorter加载表内容.

表加载得很好,但由于某种原因,该类在该函数中没有被识别,我不知道为什么.

javascript jquery tablesorter

1
推荐指数
2
解决办法
2511
查看次数

使用 TableSorter 插件重置过滤器*和*默认排序

我正在使用 Mottie https://mottie.github.io/tablesorter/的 jQuery 插件,并且看到了使用外部链接重置过滤器的功能。我在排序中也看到过同样的情况。但是,我希望能够重置过滤器恢复默认排序。

这就是我所拥有的,它不适用于排序,但至少可以重置过滤器。

HTML: <a href="#" id="reset-link">reset</a>

JavaScript:

$('#reset-link').click(function(){
    $('#mytable').trigger('sortRestart').trigger('filterReset');
    return false;
});
Run Code Online (Sandbox Code Playgroud)

sorting jquery tablesorter filter reset

1
推荐指数
1
解决办法
2925
查看次数

点击事件未在第二页上注册

我正在使用tablesorter和tablesorter.pager.这是我的代码.

$(document).ready(function() {
$("#peopletable")
        .tablesorter({ widthFixed: true, widgets: ['zebra'] })
        .tablesorterFilter({ filterContainer: $("#people-filter-box"),
            filterClearContainer: $("#people-filter-clear-button"),
            filterColumns: [1, 2, 3],
            filterCaseSensitive: false
        })
        .tablesorterPager({ container: $("#peoplepager") });

$("#peopletable tr.data").click(function() {
    var personid = $(this).attr('id');
    $.ajax({
    type: "POST",
    url: "/Search/GetDocumentsByPerson",
    data: { "id": personid },
    datatype: "json",
    success: function(data) {
        var results = eval(data);
        $("#documentstable > tbody tr").remove();
        $.each(results, function(key, item) {
            $("#documentstable > tbody:last").append(html);
        });
        $("#documentstable").trigger("update");
    }
});
});
});
Run Code Online (Sandbox Code Playgroud)

一切都很好,除非我点击下一页我的按钮点击事件不会触发.这是jquery tablesorter的已知问题吗?

html paging jquery tablesorter javascript-events

0
推荐指数
1
解决办法
1594
查看次数

jQuery TableSorter仅适用于ID(数字字段),而不适用于其他字段,如文本,日期等

在我的Web应用程序中,我维护了用户记录表.在客户端发送时添加和删除记录,而不是用户单击"保存"按钮以保存在服务器上完成的所有操作.

我已经将表分类器应用于表上的排序功能.但令人惊讶的排序功能只适用于ID字段,即表的第一个字段,但对于所有其他字段,它给出错误(来自chrome的错误跟踪)

Uncaught TypeError: Cannot read property 'type' of undefined
multisortjquery.tablesorter.js:600
$.extend.tablesorter.construct.each.$headers.click.mousedown.onselectstart 
Run Code Online (Sandbox Code Playgroud)

这是表结构.

<table id="contentTable" class="tablesorter">
                        <thead>
                            <tr>
                                <th> ID </th>
                                <th> Name </th>
                                <th> Birth Date </th>
                                <th> City </th>
                                <th id="actionheader"> Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td></td>
                            </tr>
                        </tbody>
                    </table>
Run Code Online (Sandbox Code Playgroud)

在此我动态添加数据.在这种情况下,排序仅适用于第一个字段,即ID字段

这就是我初始化tableSorting的方法.

  function initializeTableSorting() {
        $("#contentTable").tablesorter({
            sortList : [[0, 0]],
            headers : {
                0 : {
                    sorter : "integer"
                },
                1 : {
                    sorter : "text"
                },
                2 : {
                    sorter : false
                },
                3 : { …
Run Code Online (Sandbox Code Playgroud)

jquery tablesorter jquery-plugins

0
推荐指数
1
解决办法
3888
查看次数

jQuery Tablesorter传呼机:获取当前查看的页码

我已经浏览了文档和一些示例,但找不到答案...

您如何获得正在查看的当前页面?这是为了限制从数据库返回的结果数。

谢谢

编辑:更新名称,因为我意识到它是多么模糊

jquery tablesorter

0
推荐指数
1
解决办法
737
查看次数