datetables无数据时展示暂无数据

如果使用 DataTables 插件来展示数据，可以通过配置 language 属性来实现无数据时展示暂无数据的效果。具体的实现方法如下：

1. 在 DataTables 的初始化代码中添加以下语句，设置 language 属性。

$('#myTable').DataTable({
    language: {
        emptyTable: "暂无数据"
    }
});

2. 在 HTML 中添加一个 id 为 myTable 的表格元素。

<table id="myTable">
    <thead>
        <tr>
            <th>列1</th>
            <th>列2</th>
        </tr>
    </thead>
    <tbody>
        <!-- 这里是表格数据 -->
    </tbody>
</table>

当表格数据为空时，就会展示暂无数据的提示信息。

相关问题

datetables中date无数据时展示暂无数据

如果 DataTables 中的日期列（或其他类型的列）没有数据时，也可以通过自定义渲染函数来展示暂无数据的效果。

1. 首先需要在 DataTables 的初始化代码中，为需要展示暂无数据的列设置一个自定义渲染函数。

$('#myTable').DataTable({
    columns: [
        { data: 'name' },
        {
            // 这里是需要展示暂无数据的日期列
            data: 'date',
            render: function(data, type, row) {
                if (type === 'display' && data === null) {
                    return '暂无数据';
                } else {
                    return data;
                }
            }
        },
        { data: 'status' }
    ]
});

2. 在 HTML 中添加一个 id 为 myTable 的表格元素，并且在数据中为日期列设置 null 值。

<table id="myTable">
    <thead>
        <tr>
            <th>名称</th>
            <th>日期</th>
            <th>状态</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>项目1</td>
            <td>null</td>
            <td>未开始</td>
        </tr>
        <tr>
            <td>项目2</td>
            <td>2021-08-01</td>
            <td>进行中</td>
        </tr>
        <!-- 这里是更多的表格数据 -->
    </tbody>
</table>

当日期列的值为 null 时，渲染函数就会将其替换为暂无数据的提示信息。注意，渲染函数只在显示表格数据时调用，而在排序、搜索等操作时不会调用，因此不会影响 DataTables 的正常功能。

datetables中date无数据表格展示无数据

如果datatables中的date列没有数据，可以使用datatables提供的无数据表格展示功能。可以通过设置language.emptyTable选项，来自定义无数据表格的显示信息。例如，可以使用以下代码来显示“暂无数据”的提示信息：

$('#example').dataTable( {
  "language": {
    "emptyTable": "暂无数据"
  }
} );

这样，当datatables中的数据为空时，就会显示一个表格，其中只有一行，显示“暂无数据”的文本。