JQuery将thead和tbody附加到表中

Question

我使用JQuery构建DataTable。但是我收到 function getItemStyles() { try { //fetch item styles $.ajax({ cache: false, dataSrc: "Data", url: 'manage-prices-get-item-styles', data: {}, type: 'post', success: getItemStylesSucess, error: fail }); } catch(e){ alert(e.message); } } function getItemStylesSucess(result) { try { var output = ''; if (result.success == true) { //build table var xmlDoc = $.parseXML(result.message); var list = $(xmlDoc).find("Inventory"); //Create a HTML Table element. var table = $("<table id='item-style-table' class='table table-bordered table-striped' />"); table[0].border = "1"; //Add the header row. var row = $(table[0].insertRow(-1)); list.eq(0).children().each(function () { var headerCell = $("<th />"); headerCell.html(this.nodeName); row.append(headerCell); }); table[0].append('</thead>'); //Add the data rows. $(list).each(function () { row = $(table[0].insertRow(-1)); $(this).children().each(function () { var cell = $("<td />"); cell.html($(this).text()); row.append(cell); }); }); var dvTable = $("#item-styles"); dvTable.html(""); dvTable.append(table); $("#item-style-table").DataTable(); } else { output = result.message; } $('#item-styles-load').css('display', 'none'); } catch (e) { alert(e.message); } } 错误。这是因为我的代码不包括thead和tbody。

如何将thead和tbody添加到以下代码中？

我已尝试添加dataSrc：＆＃34;数据＆＃34;，但无效。我理解DataTables需要thead才能正确格式化。

npm install

Answer 1

更改代码如下，它可以100％运行。

参考：DataTables when HTML table is created through import of xml

function getItemStylesSucess(result) {
        try
        {
            var output = '';

            if (result.success == true) {
                //build table
                $("#item-styles").DataTable({
                    data: loadItemStylesData(result.message)
                })

            }
            else {
                output = result.message;
            }

            $('#item-styles-load').css('display', 'none');

        }
        catch (e) {
            alert(e.message);
        }
    }

    function loadItemStylesData(rocol) {
        var data = [];
        $(rocol).find('Inventory').each(function () {
            data.push([
                       $(this).find("InventoryID").text(),
                       $(this).find("SytleColour").text()
            ])
        })
        return data;
    }