使用“成功/错误”捕获DataTable JSON / AJAX GET是否正确填充

时间:2019-02-28 09:12:11

标签: javascript jquery datatables

我有一个DataTable正在执行GET,但我当时认为需要保护以帮助改进UI并显示某些错误,以便用户知道是否未显示数据发生了错误,并且没有坐在黑屏上。

无论如何,我都知道如何在POST中执行此操作,但我想知道是否存在在GET中执行此操作的方法。

当前的“工作代码”

var existingRuleTable = $('#existingRulesDataTable').DataTable({
    "ordering": false,                                                  // Allows ordering
    "searching": false,                                                 // Searchbox
    "paging": true,                                                     // Pagination
    "info": false,                                                      // Shows 'Showing X of X' information
    "pagingType": 'simple_numbers',                                     // Shows Previous, page numbers & next buttons only
    "pageLength": 10,                                                   // Defaults number of rows to display in table. If changing this value change the show/hide below
    "dom": '<"top"f>rt<"bottom"lp><"clear">',                           // Positions table elements
    "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],              // Sets up the amount of records to display
    "fnDrawCallback": function () {
        if ($('#dialPlanListTable').DataTable().rows().count() < 11) {
            $("div[class='bottom']").hide();                            // Hides paginator & dropdown if less than 11 records returned
        } else {
            $("div[class='bottom']").show();                            // Shows paginator & dropdown if 11 or more records are returned
        }
    },
    'ajax': {
        "type": 'GET',
        "url": "js/dataTable.json",                                     
        "data": function (data) {
            return data;
        }
    },
    "columns": [                                                        // Display JSON data in table
        { "data": "position" },
        { "data": "startTime" },
        { "data": "endTime" },
        { "data": "selectedDays" },
        { "data": "selectedDates" },
        { "data": "selectedMonths" },
        { "data": "timeRange" },
        {
            "data": null,
            "render": function (data) {
                if (buttonclicked == 'Modify') {                        // Displays the radio button when 'Mod' clicked
                    return  '<label class="c-radio" style="margin-bottom: 0px">'
                        +   '<input type="radio" name="existingRuleActionRadioButton" value="option1">'
                        +       '<span class="fa fa-check"></span>'
                        +   '</label>';
                } else if (buttonclicked == 'Delete') {                 // Displays the delete button when 'Del' clicked
                    return '<button name="deleteRuleButton" class="btn btn-danger" id="' + data.position + '">'
                        + '<i class="fa fa-trash-o" style="font-size: large"></i>'
                        + '</button>';
                } else {
                    return ''; // Needed for the 'Add' button click
                }
            }
        }
    ]
});

我尝试过的事情 最后添加了此功能,但我不知道状态(成功/错误)

"initComplete": function(settings, json) {
     alert( 'DataTables has finished its initialisation.' );
}

然后尝试进行打击AJAX,然后将其丢入正确的“成功/错误”,但这并没有使我的DataTable

'ajax': {
    "type": 'GET',
    "url": "js/dataTable.json",
    "data": function (data) {
        return data;
    },
    success: function(data){
        alert('Success');
    },
    error: function(e){
        alert('Failed');
    }
},

1 个答案:

答案 0 :(得分:1)

数据表提供了许多可以关联到的事件:

https://datatables.net/reference/event/

在这种情况下,与其使用initComplete(似乎用于DataTables“ Editor”插件),似乎要挂入的事件是error事件:

https://datatables.net/reference/event/error

您还可以查看drawxhr事件。

似乎在success:属性上使用error:ajax:正在覆盖dataTables,使用它们渲染表;这可能就是为什么公开xhr事件而不是公开潜在的ajax承诺的原因。