第一次运行后，jQuery Datatables Ajax调用被破坏

Question

我有一个数据表：

var dt = $("#reservations").DataTable(
                {
                    columns: [
                        {
                            data: "ReservationStart",
                            render: function (data) {
                                return $.format.date(data, "d MMM, yyyy h:mm a");
                            }

                        },
                        {
                            data: "Covers"
                        },
                        {
                            data: "id",
                            render: function (data) {
                                return "<button class='btn btn-primary js-edit' data-reservation-id=" + data + ">Edit</button> &nbsp; <button class='btn btn-secondary js-delete' data-reservation-id=" + data + ">Delete</button>";
                            }
                        }
                    ]
                }
            );

数据表用于显示客户的预订列表。 首先，客户输入他们的电子邮件地址，然后我进行ajax调用以检索其客户ID，然后进行第二次ajax调用以使用与该客户ID相关的所有预订来填充表格：

var baseURL = "/api/Reservations?CustomerId=";

$("#btnSearch").on("click",
            function () {
                var custEmail = $("#txtEmail").val();
                var customer = $.ajax(
                    {
                        url: "/api/Customers?email=" + custEmail,
                        data: "",
                        success: function (customer) {
                            var ajaxurl = baseURL + customer.id;
                            var ajaxobj = {
                                url: ajaxurl,
                                dataSrc: ""
                            };
                            dt.ajax.url(ajaxobj).load();
                            dt.clear().draw();
                        },
                        error: function () {
                            bootbox.alert("Doesn't look like you've made any bookings.");
                        }
                    });
            });

页面加载后，这可以正常工作。 但是，如果您尝试执行第二次搜索，则对此保留API的ajax调用的URL会更改为：

http：// localhost：55601 / api / Reservations？CustomerId = 1＆_ = 1522265383241

对此：

http：// localhost：55601 / Reservations / [object％20Object]？_ = 1522265383242

我已经对[object%20Object]广泛的研究，这似乎表明ajax请求格式错误。 在某些情况下，URL格式错误，在其他情况下，指定http方法可以解决该问题。 但是，就我而言，这两个似乎都不是问题，而且奇怪的是它在第一次运行时就起作用了，所以我认为不是这样。

我添加了一些日志来显示正在发生的事情：

如您所见，客户API调用每次运行正常。 每次发送给URL的URL都已正确设置，该URL发送到用于预订API的ajax调用。 我唯一看到的与第一轮不同的是，“数据”是未定义的。

我在这里做错了吗？ 还是jquery或datatables插件的工作方式存在我不了解的怪癖？

Answer 1

我设法弄清楚了问题所在。 通常，在初始化表时，可以指定一个ajax对象：

$("#mytable").DataTables({
    ajax:
    {
        url: [api url],
        dataSrc: [data source or blank]
    },
    columns:
    [
        etc...
    ]
});

就我而言，因为直到用户执行搜索之前我都没有数据，所以我没有指定它（使用没有指定url的ajax对象初始化表会导致未定义的错误）。 因此，当我第一次为数据表（而不是为客户搜索）运行ajax调用时，必须将一个对象传递给它。 将URL传递给它只会导致未定义的错误。

但是，在随后的运行中，由于此时已经定义了ajax对象，因此将对象作为URL参数传递会产生预期的效果-URL是一个对象，因此我们看到的是[object%20Object] 。

我以前尝试使用destroy（）函数无效。 因此，我的解决方法只是使用迭代计数器。 在第一次运行时，我将其传递给对象，在随后的运行中，我将其传递给URL。

我不确定是否有更好的方法可以做到这一点。