Jquery 在Footable中使用链接不起作用？

我正在一个页面上使用FooTable，该页面通过一个简单的ajax调用接收数据。我在页面上的表格是：

  <table id="orderDashboard" class="table table-bordered table-hover footable margin-top-20" data-type="html"  data-paging="true" data-filtering="true" data-sorting="true" data-editing="false" data-page-size="50">


            </table>

运行它的JavaScript代码是：

$( window ).load(function() {

    var myLink = "<a href='#' onclick='editRepairOrder();'>";

    //$editorTitle = $('#editor-title'),
    ft = FooTable.init('#orderDashboard', {
        columns: [
            {"name":"orderDate","title":"Order Date"},
            {"name":"customer","title":"Customer"},
            {"name":"numberOfParts","title":"Number of Parts"},
            {"name":"OrderNum","title":"R2 Order #"},
            {"name":"orderStatus","title":"Order Status"},
            {"name":"lastUpdate","title":"Last Change Date"},
            {"name":"id","title":"Action","breakpoints":"xs sm","type":"HTML","style":{"width":40,"maxWidth":40}}
        ],
        rows: [
            {"orderDate":"","customer":"","numberOfParts":"","orderNum":"","orderStatus":"","lastUpdate":"","id":""}
        ]
    });

    $.ajax({
        type: "GET", url: "./getRepairsDashboard", dataType: "json",
        success:function(data){

            $.each(data, function(index, item){
                var row = create_table_row(item);
                $('table tbody').append(row).trigger('footable_redraw');
            });

            $('table').footable();

            $('.footable').trigger('footable_redraw'); //force a redraw

        },
        error: function (req, status, err) {
            console.log('add items to table error: ', status, err);
        }
    });

    $('<a href="#"><span class="play"></span><span class="trackName">Track Name</span></a>')

    function create_table_row (item) {
        var row = $('<tr><td>' + item.orderDate + '</td><td>' + item.customer + '</td>' +
                '<td>' + item.numberOfParts + '</td><td>' + item.orderNum + '</td><td>' + item.orderStatus + '' +
                '</td><td>' + item.lastUpdate + '</td><td><a href=' + item.id +'>' + item.id + '</a></td></tr>');
        return row;
    }

    $('table').footable();     
});

$（窗口）.load（函数（）{
var myLink=“”）
函数创建表格行（项目）{
变量行=$（“”+item.orderDate+“”+item.customer+“”+
''+item.numberOfParts+''+item.orderNum+''+item.orderStatus+''+
''+item.lastUpdate+''；
返回行；
}
$（'table'）.footable（）；
});

但是，FooTable会在数据填充时去掉html标记。通过JavaScript设置列和行也会在插入的数据上方留下一个空行，例如：

如果我在表格中通过HTML设置我的列

<table id="orderDashboard" class="table table-bordered table-hover footable margin-top-20" data-type="html"  data-paging="true" data-filtering="true" data-sorting="true" data-editing="false" data-page-size="50">
                <thead>
                <tr>
                    <th data-toggle="true">
                        Order Date
                    </th>
                    <th data-sort-ignore="true">
                        Customer
                    </th>                        
                </tr>
                </thead>

            </table>

订购日期
顾客

然后，我在插入的数据上方得到了“No Results”默认消息行。看来我赢不了！我使用的是Bootstrap 3。这是一个Spring MVC应用程序

我想知道DataTable框架是否更适合。FooTable上的文档似乎有点绕圈，缺乏深度

非常感谢您的帮助！

这对我很有用：

HTML列

以下是您的问题解决方案：footable的格式化程序功能，为您提供完整的自定义绑定。我将为搜索相同解决方案的其他人提供此信息