Datatables 使用引导框在弹出窗口中显示数据表

我有下面的JS函数，它在弹出窗口中显示日期列表

此函数在返回所需数据的AJAX调用后调用

function Show(currentSchedule) {
    var scheduleDates = currentSchedule.Dates.join(", ");

    bootbox.dialog({
        title: "Preview",
        message: "<div class='row'><div class='box'>" + scheduleDates + "</div></div>"
    });
}

功能显示（当前计划）{
var scheduleDates=currentSchedule.Dates.join（“，”）；
bootbox.dialog({
标题：“预览”，
消息：“+scheduleDates+”
});
}

这将在单击按钮时调用，并以逗号分隔的值显示日期

为了以表格格式显示这一点，我查看了Datatables.js库

它要求存在一个模板表，将所需的数据注入其中。当您在页面上显示数据时，这样做很好

<table style="width:100%" id="previewTable" class="table table-striped table-bordered">
    <thead>
        <tr>
            <th>
                Date(s)
            </th>
        </tr>
    </thead>
    <tbody></tbody>
</table>

日期

我搞不懂的是如何在弹出窗口中显示表格而不是页面

---

提前感谢。

重点介绍

表作为模板存储在隐藏的

中。我克隆模板是为了设置唯一的ID

示例

var container=$（'#示例容器'）.clone（）；
container.find（'table'）.attr（'id'，'example'）；

---

使用

show:false

最初隐藏对话框。这是必需的，这样我们可以在显示对话框后添加DataTables初始化函数

var-box=bootbox.dialog({
秀:假,，
消息：container.html（），
// ...
});    

---

显示初始化数据表的对话框时处理事件

box.on("shown.bs.modal", function() {
   $('#example').DataTable(); 
});

---

显示对话框

box.modal('show');          

演示

有关代码和演示，请参见下面的示例

$（文档）.ready（函数（）{
$（'#btn show'）。在（'单击'，函数（）上）{
var container=$（“#示例容器”）.clone（）；
container.find（'table'）.attr（'id'，'example'）；
var-box=bootbox.dialog({
秀:假,，
消息：container.html（），
标题：“引导框中的数据表”，
按钮：{
好:{
标签：“OK”，
类名：“btn主节点”，
回调：函数（）{
console.log（“确定按钮”）；
}
},
取消：{
标签：“取消”，
类名：“btn默认值”
}
}
});
on（“show.bs.modal”，function（）{
$（“#示例”）.DataTable（）；
});
box.modal（'show'）；
});
});

显示对话框
名称
位置
办公室
年龄
开始日期
薪水
名称
位置
办公室
年龄
开始日期
薪水
老虎尼克松
系统架构师
爱丁堡
61
2011/04/25
$320,800
加勒特温特斯
会计
东京
63
2011/07/25
$170,750
阿什顿考克斯
初级技术作者
旧金山
66
2009/01/12
$86,000
塞德里克·凯利
高级Javascript开发人员
爱丁堡
22
2012/03/29
$433,060
佐藤航空
会计
东京
33
2008/11/28
$162,700
布里尔·威廉姆森
集成专家
纽约
61
2012/12/02
$372,000
赫罗德·钱德勒
营业员
旧金山
59
2012/08/06
$137,500
罗娜·戴维森
集成专家
东京
55
2010/10/14
$327,900
科琳赫斯特
Javascript开发人员
旧金山
39
2009/09/15
$205,500
索尼娅·弗罗斯特
软件工程师
爱丁堡
23
2008/12/13
$103,600
杰娜·盖恩斯
办公室经理
伦敦
30
2008/12/19
$90,560
奎因·弗林
支撑导线
爱丁堡
22
2013/03/03
$342,000
查尔德·马歇尔
区域主任
旧金山
36
2008/10/16
$470,600
海莉·肯尼迪
高级市场设计师
伦敦
43
2012/12/18
$313,500
塔蒂亚娜·菲茨帕特里克
区域主任
伦敦
19
2010/03/17
$385,750
迈克尔·席尔瓦
营销设计师
伦敦
66
2012/11/27
$198,500
柏德
首席财务官（CFO）
纽约
64
2010/06/09
$725,000
格洛丽亚·利特尔
系统管理员
纽约
59
2009/04/10
$237,500
布拉德利·格里尔
软件工程师
伦敦
41
2012/10/13
$132,000
戴里奥斯
人事领导
爱丁堡
35
2012/09/26
$217,500
杰内特·考德威尔
开发领导
纽约
30
2011/09/03
$345,000
尤里浆果
首席营销官（CMO）
纽约
40
2009/06/25
$675,000
凯撒万斯
售前支持
纽约
21
2011/12/12
$106,450
多丽丝·怀尔德
营业员
西德尼
23
2010/09/20
$85,6