[翻译]  jQuery dataTable doesn't show sort icon

[CHINESE]  jQuery dataTable不显示排序图标


I am trying to use a jQuery dataTable plugin. The problem is that the sort icon (this arrow which point in which direction data is actual sorted) is not displayed.

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

My code looks as follows:

我的代码如下:

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

and Html:

和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>

7 个解决方案

#1


28  

I had this problem, I found because I had copied the CDN script to my local machine it wasn't referencing the images correctly anymore as @Matt2012 pointed out. So my solution was to updated the CSS file to look for those images where I want to put them, after I saved them also.

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

See this part:

看这部分:

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; }

#2


12  

I had this problem and it took me an hour to discover that I was not linking to a required stylesheet. In my case, I had:

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

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

but I also needed to add:

但我还需要补充:

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

for the sort icons to show up. This is likely a bootstrap-only solution, but if you're having this problem, you might make sure you've got the right stylesheets linked.

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

#3


4  

Datatables uses a sprite for the icons you want to use firebug in firefox click on net than all and look for anything showing up in red. Which would indicate that an asset is not being loaded. You are looking form something like this "/media/css/jui_themes/smoothness/images/ui-icons_888888_256x240.png".

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

I am assuming that the datatable plugin is being initialised and you are seeing everything else you would expect?

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

You may want to look at this http://debug.datatables.net/ which is a bookmarklet that helps debugging this plugin.

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

#4


1  

Everytime I have had that problem with dataTables it stems from a javascript error.
Also, you could try adding

每次我遇到dataTables的问题都源于javascript错误。此外,你可以尝试添加

"bSort": true,

#5


1  

I fixed the problem by wrapping the table header text in a <div>:

我通过将表头文本包装在

中来解决问题:

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

#6


1  

I had the problem too. Just use their own configurator to setup all the options you want form here https://datatables.net/download/ they will generate exactly the .js and .css files you need. You then can either download or use their own hosted CDN for both files

我也遇到了这个问题。只需使用他们自己的配置器来设置您想要的所有选项,这里https://datatables.net/download/他们将生成您需要的.js和.css文件。然后,您可以为这两个文件下载或使用自己的托管CDN

#7


0  

I just UPGRADED JQuery datatable, now works fine

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


注意!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系我们删除。



 
© 2014-2018 ITdaan.com 粤ICP备14056181号