Question

我正在使用ajax调用部分视图，其中包含一个名为“div-GVPrevision”的div中的表。我正在使用数据表，但是在ajax调用之后我收到了一个错误，它说：

“DataTables警告：表格ID = GVPrevision - 无法重新初始化DataTable。有关此错误的详细信息，请参阅http://datatables.net/tn/3”

这是ajax代码：

<script>
    function GVPrevision() {
        $('#GVPrevision').DataTable({
            "aaSorting": [],
            aLengthMenu: [
                [4, -1],
                [4, "Todo"]
            ],
            responsive: false
        });
    }
    $(document).ready(function () {
        GVPrevision();
        $('.btnagregar').click(function (event) {
            event.preventDefault();
            var data = {
                "codmov": $("#codmovf").val(),
                "fechainicio": $("#fechainiciof").val(),
                "fechatermino": $("#fechaterminof").val(),
                "rutentidad": $("#rutentidadf").val(),
                "motivo": $("#motivof").val()
            };
            $.ajax({
                url: "/Ficha/AgregarfooterPrevision",
                type: "POST",
                data: JSON.stringify(data),
                dataType: "json",
                contentType: "application/json",
                success: function (response) {
                    if (response.Success) {
                        $("#div-GVPrevision").load('@Url.Content("~/Ficha/GVPrevision")');
                        GVPrevision();
                    }
                    else
                        window.location.href = "@Url.Action("Prevision", "Ficha")";
                },
                error: function () {
                    console.log('Login Fail!!!');
                }
            });
        });
    });
</script>

Answer 1

因为我相信数据库初始化时间超过一次，因为你没有显示整个代码我只能提供这个简单但不是完全推荐的解决方案是销毁数据表然后调用GCPervision 再说它根本不是推荐的溶液但是是溶液，只需使用Distroy功能

    function GVPrevision() {
            $('#GVPrevision').DataTable({
                "aaSorting": [],
                aLengthMenu: [
                    [4, -1],
                    [4, "Todo"]
                ],
                responsive: false
            });
        }
        $(document).ready(function () {
            GVPrevision();
            $('.btnagregar').click(function (event) {
                event.preventDefault();
                var data = {
                    "codmov": $("#codmovf").val(),
                    "fechainicio": $("#fechainiciof").val(),
                    "fechatermino": $("#fechaterminof").val(),
                    "rutentidad": $("#rutentidadf").val(),
                    "motivo": $("#motivof").val()
                };
                $.ajax({
                    url: "/Ficha/AgregarfooterPrevision",
                    type: "POST",
                    data: JSON.stringify(data),
                    dataType: "json",
                    contentType: "application/json",
                    success: function (response) {
                        if (response.Success) {
                $('#GVPrevision').DataTable().destroy();
                            $("#div-
         GVPrevision").load('@Url.Content("~/Ficha/GVPrevision")');
                            GVPrevision();
                        }
                        else
                            window.location.href = "@Url.Action("Prevision", "Ficha")";
                    },
                    error: function () {
                        console.log('Login Fail!!!');
                    }
                });
            });
        });
    </script>

Answer 2

您已在此处调用DataTable方法2次，一次在document.ready方法＆amp;另一种是AJAX success方法：

$(document).ready(function () {
    GVPrevision(); // first call
    $('.btnagregar').click(function (event) {

        // data insertion here

        $.ajax({

            // other ajax options here

            success: function (response) {
                if (response.Success) {
                    $("#div-GVPrevision").load('@Url.Content("~/Ficha/GVPrevision")');
                    GVPrevision(); // second call - this will fail
                }
                else
                    window.location.href = "@Url.Action("Prevision", "Ficha")";
            },
            error: function () {
                console.log('Login Fail!!!');
            }
        });
    });
});

要解决此问题，您有两种选择：

在GVPrevision或AJAX POST document.ready部分之后删除success之一的电话，
在创建另一个destroy和DataTable之前使用bDestroy方法（有时称为destroy fnDestroy方法，选择哪个是DataTable适用于function GVPrevision() { $('#GVPrevision').DataTable({ "aaSorting": [], aLengthMenu: [ [4, -1], [4, "Todo"] ], responsive: false, "bDestroy": true }).destroy(); // or fnDestroy() }版本的内容：
```
DataTable
```

如果您有destroy: true版本1.10或更高版本，则可以添加function GVPrevision() { $('#GVPrevision').DataTable({ destroy: true // add this line "aaSorting": [], aLengthMenu: [ [4, -1], [4, "Todo"] ], responsive: false, }); }：

.x_container

参考：

Warning: Cannot reinitialise DataTable（DataTables文档）

Datatables warning(table id = 'example'): cannot reinitialise data table

Answer 3

我通过用jquery $ .post（）方法替换代码来修复问题：

                    if (response.Success) {
                        $.post("/Ficha/GVPrevision", function (datos) {
                            $("#div-GVPrevision").html(datos);
                            GVPrevision();
                        })
                    }

ajax调用后的数据表错误，ASP.Net

3 个答案: