从Razor Pages的AJAX Json呈现DataTables问题.Net GET

我一直在try 遵循DataTables(https://datatables.net/examples/api/row_details.html)中的这个示例，但似乎无法加载表数据.我的AJAX调用命中.NET.cshtml.cs代码隐藏文件中的断点并返回json对象.但数据表只显示"正在加载".如果有人对我可以try 的其他东西有任何线索，我会非常感激，我已经try 了基于其他例子的许多不同的事情.谢谢!

下面是我的OnGet方法，AJAX调用调用该方法(通过断点命中进行验证):

public JsonResult OnGetAllCustomers()
{
    List<Customer> lstCustomers = new List<Customer>();
    lstCustomers = objCustomerDAL.GetAllCustomers();
    var output = JsonConvert.SerializeObject(lstCustomers);
    return new JsonResult("\"data\":" + output);
}

下面是我的表定义:

        <div class="row">
            <table id="CustomersTable" class="display table-striped table-bordered" style="width:100%">
                <thead>
                    <tr>
                        <th></th>
                        <th>Company Name</th>
                        <th>Contact Name</th>
                        <th>Contact Title</th>
                        <th>City</th>
                        <th>State</th>
                    </tr>
                </thead>
            </table>
        </div>

以下是文本展示器中的JsonResult:

"data":[{"CustomerID":106,"CompanyName":"Clean Companyee","ContactName":"Mr Clean we","ContactTitle":"Washeree","Address":"111 Clean Steet","City":"Scrubee","State":"MT","ZipCode":"22222","Phone":"333-444-5555","Email":"clean@brush.com","DateCreated":"2024-01-30T11:29:15.997","UserIDCreated":4695,"DateLastModified":"2024-02-16T14:44:58.377","UserIDLastModified":4695},{"CustomerID":107,"CompanyName":"Bill's Paper Mill","ContactName":"Bill Sorenson","ContactTitle":"Owner","Address":"384 Running Brook Lane","City":"Dallas","State":"TX","ZipCode":"25415","Phone":"747-666-3333","Email":"Bill@Paper.com","DateCreated":"2024-01-18T14:42:10","UserIDCreated":4695,"DateLastModified":"2024-01-23T11:46:34.943","UserIDLastModified":4695},
{"CustomerID":108,"CompanyName":"The Addition Company","ContactName":"Joe Math","ContactTitle":"Mathemetician","Address":"333 Flower Lane","City":"Pittsburgh","State":"PA","ZipCode":"25412","Phone":"666-666-9999","Email":"joe@math.com","DateCreated":"2024-01-16T09:14:48.127","UserIDCreated":4695,"DateLastModified":"2024-01-16T09:14:48.127","UserIDLastModified":4695}, ... etc

下面是JQuery，它与示例类似，但是使用Get in.Net和文本文件修改了数据列和AJAX.

<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-3.7.1.js"></script>
<script src="https://cdn.datatables.net/2.0.0/js/dataTables.js"></script>

<script>
    // Formatting function for row details - modify as you need
    function format(d) {
        // `d` is the original data object for the row
        return (
            '<dl>' +
            '<dt>Phone: </dt>' +
            '<dd>' +
            d.phone +
            '</dd>' +
            '<dt>Email: </dt>' +
            '<dd>' +
            d.email +
            '</dd>' +
            '<dt>Extra info:</dt>' +
            '<dd>And any further details here (images etc)...</dd>' +
            '</dl>'
        );
    }

    let table = new DataTable('#CustomersTable', {
        ajax: {
            url: 'CustomersFlyout?handler=AllCustomers',
            dataSrc: 'data'
        },
        columns: [
            {
                className: 'dt-control',
                orderable: false,
                data: null,
                defaultContent: ''
            },
            { data: "companyname" },
            { data: "contactname" },
            { data: "contacttitle" },
            { data: "city" },
            { data: "state" }
        ],
        order: [[1, 'asc']]
    });

    table.on('click', 'td.dt-control', function (e) {
        let tr = e.target.closest('tr');
        let row = table.row(tr);

        if (row.child.isShown()) {
            // This row is already open - close it
            row.child.hide();
        }
        else {
            // Open this row
            row.child(format(row.data())).show();
        }
    });
</script>

我知道正在返回Json，但无法将数据填充到表中.