jQuery dataTable不显示排序图标

Question

我正在尝试使用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>

Answer 1

我遇到了这个问题,我发现因为我已经将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; }

Answer 2

我有这个问题,我花了一个小时才发现我没有链接到所需的样式表.在我的情况下,我有:

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

但我还需要补充:

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

用于显示排序图标.这可能是一个仅限bootstrap的解决方案,但如果您遇到此问题,可能会确保您已连接正确的样式表.

Answer 3

Datatables使用精灵为你想要在firefox中使用firebug的图标点击net而不是all并查找显示为红色的任何内容.这表明资产没有被加载.你正在寻找像这样的形式"/media/css/jui_themes/smoothness/images/ui-icons_888888_256x240.png".

我假设datatable插件正在初始化,你正在看到你期望的其他一切？

你可能想看看这个http://debug.datatables.net/这是一个帮助调试这个插件的书签.