页面上的表格正在返回错误,但效果很好

时间:2019-07-12 10:47:18

标签: javascript php laravel datatables

每次重新加载页面时,我都会收到一个弹出窗口,显示错误:

  

DataTables警告:表ID =数据表-请求的未知参数   第0行第5列的“ apply_to_workdays”。有关的更多信息   此错误,请参阅http://datatables.net/tn/4

假设从链接数据表中尝试获取一些值,但无法获取它。该表显示很好。我没有其他错误,只有这两个在重新加载时出现。

它显示关于apply_to_workdays的错误,但包含该列的列显示完美,并且一切正常。在“控制台/网络”标签中没有其他错误。

我的blade.php

<div class="table-responsive dt-responsive">
        <table id="data-table" style="width: 100%;" class="display">
            <thead>
            <tr>
                <th class="text-center">Unit</th>
                <th></th>
                <th>Competence Level</th>
                <th style="padding-left: 0" class>Quantity</th>
                <th style="padding-right: 0" class="text-right">Start -</th>
                <th style="padding-left: 0" class="text-left">Finish</th>
                <th style="width: 1px">Workdays</th>
                <th style="width: 1px">Weekends</th>
                <th style="width: 1px">Holidays</th>
                <th class="text-center">Practice Type</th>
                <th style="width: 10%">Action</th>
            </tr>
            </thead>
        </table>
    </div>

JS:

(function () {
    const url = 'rotation-needs';
    const positionUrl = url + '/position';
    const buttonColumn = 9;
    const definitionFieldValues = ['name', 'description', 'active', 'apply_to_workdays', 'apply_to_weekends', 'apply_to_holidays'];
    const definition_id = 'schedule_need_definition_id';
    const required = [true, false, true];
    const columnDefs = [
            {targets: [1, 2, 3, 4, 5, 6, 7, 8], orderable: false},
            {orderable: false, className: 'reorder', targets: [buttonColumn]},
            {
                targets: buttonColumn,
                render: function (data, type, row) {
                    return "<button type=\"edit-button\"  data-toggle=\"modal\" data-target=\"#edit-position-Modal\"class=\"tabledit-edit-button btn btn-primary waves-effect waves-light\" style=\"float: none;  margin-right: 1vw;\"><span class=\"icofont icofont-ui-edit\"></span></button>"
                        + "<button type=\"button\" id=\" \" data-toggle=\"modal\" data-target=\"#remove-Modal\"class=\"tabledit-delete-button btn btn-danger waves-effect waves-light active\" style=\"float: none;\"><span class=\"icofont icofont-ui-delete\"></span></button>";
                }
            },
            {
                targets: 0,
                "createdCell": function (td, data, rowData, row, col) {
                    $(td).css('background-color', data.color);
                    $(td).css('color', colors.getContrasting(data.color));
                },
                render: function (data, type, row) {
                    if (type === 'display') {
                        return '';
                    } else {
                        return data;
                    }
                }
            },
            {
                targets: [1], className: 'text-center',
                render: function (data, type, row) {
                    var result = '';
                    if (row.competence_level_id_min.name !== null) {
                        result = result + 'min. ' + row.competence_level_id_min.name + ' <br>';
                    }
                    if (row.competence_level_id_max.name !== null) {
                        result = result + 'max. ' + row.competence_level_id_max.name;
                    }
                    return result;
                },
                "createdCell": function (td, data, rowData, row, col) {
                    $(td).css('background-color', rowData.organization_unit.color);
                    $(td).css('border-top', '1px solid #ddd');
                    $(td).css('color', colors.getContrasting(rowData.organization_unit.color));
                }
            },
            {
                targets: 2, className: 'text-center'
            },
            {
                targets: 3, className: 'text-right',
                render: function (data, type, row) {
                    return data.substring(0, 5);
                }
            },
            {
                targets: 4, className: 'text-left',
                render: function (data, type, row) {
                    return data.substring(0, 5);
                }
            },
            {
                targets: 5, className: 'text-center',
                render: function (data) {
                    if (data !== 0) {
                        return "<label class=\"badge badge-success\">✔</label>";
                    }
                }
            },
            {
                targets: 6, className: 'text-center',
                render: function (data) {
                    if (data !== 0) {
                        return "<label class=\"badge badge-success\">✔</label>";
                    }
                }
            },
            {
                targets: 7, className: 'text-center',
                render: function (data) {
                    if (data !== 0) {
                        return "<label class=\"badge badge-success\">✔</label>";
                    }
                }
            },
            {
                targets: 8, className: 'text-center',
                render: function (data, type, row) {
                    var result = '';
                    if (row.practice_type_id === 1) {
                        /*result = result + row.practice_type_id.name + ' <br>'; - na szybko bo nie wiem czmeu nie pobiera name*/
                        result = 'On-call';
                    } else if (row.practice_type_id === 2) {
                        result = 'Rotation';
                    } else {
                        result = 'Not assigned';
                    }
                    return result;
                }
            },
        ]
    ;
    const columns = [
        {"data": "organization_unit"},
        {"data": "competence_level_id_min"},
        {"data": "quantity"},
        {"data": 'time_start'},
        {'data': 'time_finish'},
        {'data': 'apply_to_workdays'},
        {'data': 'apply_to_weekends'},
        {'data': 'apply_to_holidays'},
        {'data': 'practice_type_id'},
        {'data': 'schedule_need_definition_position_id'}
    ];

        create.setOnHashSuccess(hash.switchToNew);
        create.createHashItemButton(definitionFieldValues, url, required);

        update.updateHashMenuItem(definitionFieldValues, url + '/get');
        update.confirmUpdateHashMenuItem(url + "/update", definition_id, definitionFieldValues, required);

        remove.removeHashMenuItem();
        remove.confirmRemoveHashMenuItem(url, hash.onRemove);

        dataTable.rowGrouping(0);
        dataTable.displayLength(100);


        need.initializeSelects();
        need.initializeCreate();
        need.initializeTableCRUD(url + '/position');
        need.generate();

        update.setOnSuccess(function () {
            sidebar.loadContent(undefined, function () {
                sidebar.setActive(hash.getCurrent());
            });
        });

        errorHandling.alertDismissButton();
    });
}());

1 个答案:

答案 0 :(得分:0)

在我的columnDefs(目标5,6,7)中解决了我的问题,我的if语句不带else语句,我将其更改为:

 {
                targets: 5, className: 'text-center',
                render: function (data) {
                    if (data !== 0) {
                        return "<label class=\"badge badge-success\">✔</label>";
                    }
                }
         },

收件人:

{
                targets: 5, className: 'text-center',
                render: function (data) {
                    if (data !== 0) {
                        return "<label class=\"badge badge-success\">✔</label>";
                    } else {
                        return "<label class=\"badge badge-danger\">X</label>";
                    }
                }
            },