数据表 "No data available in table"

datatables "No data available in table"

这不是我第一次使用数据表,但我有一个我似乎无法开始工作的实现。

PHP:

public function renderTable() {
    $config = $this->container->get('RestorePoint\Configuration');
    $displayAndRestoreFrom = $config->get('Settings.displayAndRestoreFrom');
    if ($displayAndRestoreFrom !== 'local') {
        $remoteStorage = $this->container->get('RestorePoint\RemoteFilesystemFactory');
        $service = $remoteStorage->service($displayAndRestoreFrom);
        $files = $service->listFilesByCreated($service->getFolder());
    } else {
        $files = $this->getFilesByCreated($config->get('dir.files'));
    }
    foreach ($files as &$file) {
        if ($displayAndRestoreFrom == 'local') {
            $file['id'] = $file['name'];
        }
        $file['adapter'] = $displayAndRestoreFrom;
        $file['created'] = date('Y-m-d H:i:s', $file['created']);
        $file['actions'] = '';//view('RestorePoint.actions')->with($file)->render();
    }
    //echo json_encode(array('data'=>$files), JSON_UNESCAPED_SLASHES);
    return response()->json($files);
}

HTML:

                                <div class="table-responsive">
                                    <table class="table card-table table-vcenter text-nowrap datatable" id="backups" role="grid">
                                        <thead>
                                            <tr>
                                                <td class="w01">Name</td>
                                                <td>Created</td>
                                                <td>Adapter</td>
                                                <td>Actions</td>
                                            </tr>
                                        </thead>
                                    </table>
                                </div>

JS: (在head中定义)

    <script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
    <script src="./assets/plugins/datatables/datatables.min.js"></script>
    <script>
        $(document).ready(function () {
            $('#backups').DataTable({
                //"deferRender": true,
                ajax: {
                    url: "<?php echo url('restorepoint/renderTable'); ?>",
                    dataSrc: ''
                },
                columns: [
                    {data: 'name'},
                    {data: 'created'},
                    {data: 'adapter'},
                    {data: 'actions'}
                ]
            });
        });
    </script>

JSON:

{"5":{"name":"restorepoint_2019_08_02_05_47_49.zip","id":"\/restore_point_backups_fagardesignscom\/restorepoint_2019_08_02_05_47_49.zip","created":"2019-08-02 05:55:11","adapter":"dropbox","actions":""},"4":{"name":"restorepoint_2019_08_02_07_30_05.zip","id":"\/restore_point_backups_fagardesignscom\/restorepoint_2019_08_02_07_30_05.zip","created":"2019-08-02 03:36:59","adapter":"dropbox","actions":""},"3":{"name":"restorepoint_2019_08_02_07_32_57.zip","id":"\/restore_point_backups_fagardesignscom\/restorepoint_2019_08_02_07_32_57.zip","created":"2019-08-02 03:35:54","adapter":"dropbox","actions":""},"2":{"name":"restorepoint_2019_08_02_07_38_55.zip","id":"\/restore_point_backups_fagardesignscom\/restorepoint_2019_08_02_07_38_55.zip","created":"2019-08-02 03:34:46","adapter":"dropbox","actions":""},"1":{"name":"restorepoint_2019_08_02_08_13_49.zip","id":"\/restore_point_backups_fagardesignscom\/restorepoint_2019_08_02_08_13_49.zip","created":"2019-08-02 03:33:40","adapter":"dropbox","actions":""},"0":{"name":"restorepoint_2019_07_31_08_10_34.zip","id":"\/restore_point_backups_fagardesignscom\/restorepoint_2019_07_31_08_10_34.zip","created":"2019-07-31 03:54:27","adapter":"dropbox","actions":""}}

Datatables 显示 "No data available in table" 但是,我不明白为什么我已经遵循了这个例子:https://datatables.net/examples/ajax/custom_data_flat.html

是索引搞砸了。

需要使用array_values()

    return response()->json(array_values($files));