第一次運行后，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。

我不確定是否有更好的方法可以做到這一點。