jQuery 如何在数据表中显示空数据消息
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14375771/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to show empty data message in Datatables
提问by Naruto
Suppose i get empty data from server sometimes, i want to display No Data found message in DataTables?. How is this possible?
假设我有时从服务器获取空数据,我想在 DataTables 中显示 No Data found 消息?。这怎么可能?
回答by Daniel
If you want to customize the message that being shown on empty table use this:
如果要自定义显示在空表上的消息,请使用以下命令:
$('#example').dataTable( {
"oLanguage": {
"sEmptyTable": "My Custom Message On Empty Table"
}
} );
Since Datatable 1.10 you can do the following:
从 Datatable 1.10 开始,您可以执行以下操作:
$('#example').DataTable( {
"language": {
"emptyTable": "My Custom Message On Empty Table"
}
} );
For the complete availble datatables custom messagesfor the table take a look at the following link reference/option/language
有关表格的完整可用数据表自定义消息,请查看以下链接参考/选项/语言
回答by Gone Coding
Later versions of dataTables
have the following language
settings (taken from here):
更高版本dataTables
具有以下language
设置(取自此处):
"infoEmpty"
- displayed when there are no records in the table"zeroRecords"
- displayed when there no records matching the filtering
"infoEmpty"
- 表中没有记录时显示"zeroRecords"
- 当没有匹配过滤的记录时显示
e.g.
例如
$('#example').DataTable( {
"language": {
"infoEmpty": "No records available - Got it?",
}
});
Note: As the property names do not contain any special characters you can remove the quotes:
注意:由于属性名称不包含任何特殊字符,您可以删除引号:
$('#example').DataTable( {
language: {
infoEmpty: "No records available - Got it?",
}
});
回答by AlexB
Late to the game, but you can also use a localisation file
游戏后期,但您也可以使用本地化文件
DataTable provides a .json
localized file, which contains the key sEmptyTable
and the corresponding localized message.
DataTable 提供了一个.json
本地化文件,其中包含密钥sEmptyTable
和相应的本地化消息。
For example, just download the localized json file on the above link, then initialize your Datatable
like that :
例如,只需在上面的链接上下载本地化的 json 文件,然后Datatable
像这样初始化:
$('#example').dataTable( {
"language": {
"url": "path/to/your/json/file.json"
}
});
IMHO, that's a lot cleaner, because your localized content is located in an external file.
恕我直言,这更清晰,因为您的本地化内容位于外部文件中。
This syntax works for DataTables 1.10.16, I didn't test on previous versions.
此语法适用于DataTables 1.10.16,我没有在以前的版本上进行测试。
回答by Antony
It is worth noting that if you are returning server side data - you must supply the Data attribute even if there isn't any. It doesn't read the recordsTotal
or recordsFiltered
but relies on the count of the data object
值得注意的是,如果您要返回服务器端数据 - 即使没有数据,您也必须提供 Data 属性。它不读取recordsTotal
orrecordsFiltered
而是依赖于数据对象的计数
回答by Naruto
By default the grid view will take care, just pass empty data set.
默认情况下,网格视图会处理,只需传递空数据集。
回答by Shurvir Mori
This is a just a nice idea. that, you can Add class in body, and hide/show table while there is no data in table. This works perfect for me. You can design custom NO Record Found error messagewhen there is no record in table, you can add class "no-record", and when there is 1 or more than one record, you can remove class and show datatable
这只是一个好主意。也就是说,您可以在 body 中添加类,并在 table 中没有数据时隐藏/显示table。这对我来说很完美。当表中没有记录时,您可以设计自定义NO Record Found错误消息,您可以添加类“no-record”,当有1条或多条记录时,您可以删除类并显示数据表
Here is jQuery code.
这是jQuery代码。
$('#default_table').DataTable({
// your stuff here
"fnFooterCallback": function (nRow, aaData, iStart, iEnd, aiDisplay) {
if (aiDisplay.length > 0) {
$('body').removeClass('no-record');
}
else {
$('body').addClass('no-record');
}
}
});
Here is CSS
这是 CSS
.no-record #default_table{display:none;}
而这里是官方链接。
回答by Sumit Kumar Gupta
I was finding same but lastly i found an answer. I hope this answer help you so much.
我发现相同但最后我找到了答案。我希望这个答案对你有很大帮助。
when your array is empty then you can send empty array just like
当您的数组为空时,您可以像这样发送空数组
if(!empty($result))
{
echo json_encode($result);
}
else
{
echo json_encode(array('data'=>''));
}
Thank you
谢谢