jQuery dataTable不显示排序图标

2021/01/06 01:21 · jquery ·  · 0评论

我正在尝试使用jQuery dataTable插件。问题是没有显示排序图标(该箭头实际指向哪个方向的数据)。

我的代码如下所示:

$('#example').dataTable({
    "bPaginate": false,
    "bFilter": false,
    "oLanguage": {
        "sInfo": ""
    }
});

和HTML:

<table class="surfClass" cellspacing="1" id="example">
    <thead>
        <tr>
            <th width="120px">Name</th>
            <th width="120px">The hourly rate (points)</th>
            <th>Levels of referrals</th>
            <th>bonuses</th>
            <th width="70px">Payout minimum</th>
        </tr>
    </thead>
</table>

我遇到了这个问题,我发现是因为我已经将CDN脚本复制到了本地计算机上,因为@ Matt2012指出它不再正确地引用映像了。因此,我的解决方案是更新CSS文件,以在保存完这些图像后查找要放置它们的图像。

看到这部分:

table.dataTable thead .sorting { background: url('/Content/images/sort_both.png') no-repeat center right; }
table.dataTable thead .sorting_asc { background: url('/Content/images/sort_asc.png') no-repeat center right; }
table.dataTable thead .sorting_desc { background: url('/Content/images/sort_desc.png') no-repeat center right; }

table.dataTable thead .sorting_asc_disabled { background: url('/Content/images/sort_asc_disabled.png') no-repeat center right; }
table.dataTable thead .sorting_desc_disabled { background: url('/Content/images/sort_desc_disabled.png') no-repeat center right; }

我遇到了这个问题,花了一个小时才发现我没有链接到所需的样式表。就我而言,我有:

<link rel="stylesheet" type="text/css" href="@{'/public/stylesheets/minidatatables-bootstrap.css'}"/>

但我还需要添加:

<link rel="stylesheet" type="text/css" href="@{'/public/stylesheets/datatables-bootstrap.css'}"/>

以便显示排序图标。这可能是仅引导程序的解决方案,但是如果遇到此问题,则可以确保已链接正确的样式表。

Datatables将精灵用作您要在firefox中使用firebug的图标,然后单击net,然后查找所有显示为红色的内容。这表明资产没有被装载。您正在寻找类似“ /media/css/jui_themes/smoothness/images/ui-icons_888888_256x240.png”的表格。

我假设datatable插件正在初始化,并且您看到了其他所有期望?

您可能需要查看此http://debug.datatables.net/,这是一个有助于调试此插件的书签。

每当我遇到dataTables的问题时,它就源于javascript错误。

另外,您可以尝试添加

"bSort": true,

如果使用Bootstrap V4,则应包括2个其他CSS:

<link href="/bower_components/font-awesome/css/font-awesome.css"  rel="stylesheet">
<link href="/bower_components/datatables.net-plugins/integration/font-awesome/dataTables.fontAwesome.css"  rel="stylesheet">

有关更多信息,请访问此 链接

如果您使用的是BundleConfig,请添加以下参考:

“〜/ Content / DataTables / css / dataTables.bootstrap4.css”,

我通过将表标题文本包装在中来解决此问题<div>

<th><div>Date</div></th>

我也有问题。只需使用自己的配置器在https://datatables.net/download/上设置您想要的所有选项即可,它们将完全生成您需要.js.css文件。然后,您可以下载两个文件,也可以使用它们自己的托管CDN

我只是UPGRADED JQuery数据表,现在工作正常

我也遇到同样的问题。在阅读了杰里米(Jeremy)的遮阳篷之后,我得到了一个缺少的样式表的链接,该链接是:

<link href="~/lib/datatables/media/css/dataTables.uikit.css" rel="stylesheet" />
本文地址:http://jquery.askforanswer.com/jquery-datatablebuxianshipaixutubiao.html
文章标签: ,  
版权声明:本文为原创文章,版权归 admin 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!