在jQuery的数据表锚标签排序列(Sorting column with anchor tags

2019-10-18 16:08发布

我用了jQuery插件数据表中排序表中的数据。 如果列包含简单的文本排序工作正常。 如果我把任何锚标记条件上的文本,则列排序不正确排序。

我显示在下面的方式中的值:

<td><?php if ($allAptArr[$d][27]['staffinactive'] == 1) { ?>
        <?=ucwords(stripslashes($allAptArr[$d][5]['staff_name']));?>
    <?php } else { ?>
        <a href='#' onClick="redirectToStaff('<?=$allAptArr[$d][10]['staff_id']?>');">
        <?=ucwords(stripslashes($allAptArr[$d][5]['staff_name']));?>
        </a>
<?php } ?> </td>

与此代码的列排序失败。

Answer 1:

就绪函数之前补充一点:

    //sets up numeric sorting of links
    jQuery.fn.dataTableExt.oSort['num-html-asc'] = function(a,b) {
    var x = a.replace( /<.*?>/g, "" );
    var y = b.replace( /<.*?>/g, "" );
    x = parseFloat( x );
    y = parseFloat( y );
    return ((x < y || isNaN(y) ) ? -1 : ((x > y || isNaN(x)) ? 1 : 0));
    };

    jQuery.fn.dataTableExt.oSort['num-html-desc'] = function(a,b) {
    var x = a.replace( /<.*?>/g, "" );
    var y = b.replace( /<.*?>/g, "" );
    x = parseFloat( x );
    y = parseFloat( y );
    return ((x < y || isNaN(x)) ? 1 : ((x > y || isNaN(y) ) ? -1 : 0));
    };

而在准备功能:

        "aoColumns": [
          { "sType": "num-html" },
          null,
          etc. etc.
        ]

这是怎么对我的作品与锚,整数越来越有序的,因为他们应该。



Answer 2:

设置列类型为“HTML”:

$('#example').dataTable( {
    "aoColumns": [ 
        { "sType": "html" },
        null,
        null,
        null,
        null
    ]
} );

这将在排序前剥离HTML标签。

见的S型参数文件



Answer 3:

我只是有一个问题用数据表时,链接参与排序 - 我有一个列有一些细胞的联系,而在其他没有链接。 它似乎排序,但它是排序的所有链接,然后将所有非链接,反对两个链接和非链接整理到一起。 这个问题竟然在标记被间隔。 当我拿走了所有非必要的间距围绕任何一个标签,我的专栏完全排序。



Answer 4:

这是答案比较晚,它仍然会有助于其他读者,你可以把一个虚拟列。 还隐藏通过虚拟列虚拟列和排序实际列。 假设我有三列然后加上第四coulmn为假,并把这个DataTable中调用

$('#example').dataTable({ "aoColumns": [null, null, {"iDataSort":3 }, { "bVisible": false}]);


Answer 5:

我认为它的,因为你是混合在同一列不锚数据定。 你也应该不使用的onClick,aspecialy使用jQuery,只安装有正确的选择点击()函数。



Answer 6:

随着工程的人说,不是你把TDS所有内容排序。 需要具体禁用例如链接。 下面的代码段将禁用排序为表中的第一列。

<script type="text/javascript">
$(document).ready(function ()
{
    $('#example').dataTable({
            "aoColumnDefs":[{"bSortable": false, "aTargets": [0]}]});
});
</script>


Answer 7:

我的数据表中有2列,第一列有<a>元素,我试图给我的第一列进行排序,但排序不能正常工作。 我尝试过很多方法,但让我添加了一个隐藏列因此未作@Html.Raw其绑定到我绑定到相同的模型属性<a> ,整理我的隐藏的列。 请参阅以下链接

jQuery的/ JavaScript的:排序列上一个DataTable有<A>



Answer 8:

我用数据表HTML5数据属性来获取被包裹在一个锚定标记可排序的日期的所期望的功能。

这里是许多表格单元格中的一个HTML片段:

<td data-order="20180115"><a href="#">01/15/2018</a></td>


文章来源: Sorting column with anchor tags in jQuery DataTables