bootstrap3 模态表未加载数据答案

【问题标题】：bootstrap3 modal table not loading databootstrap3 模态表未加载数据
【发布时间】：2014-03-22 00:55:47
【问题描述】：

各位，我一直在努力在引导程序中将模式绑定到我的表。

以下代码确实启动了模式，但不显示我试图传递的值。我尝试在此处复制功能：JSFiddle

现在，如果我从底部删除 JavaScript 部分，模式仍然会加载...我真的不知道如何让它工作:(

我想要什么：

通过循环处理 pendingArray 动态生成的表（现在可以使用）
您单击的每个表格项都会填充到模式中。

代码：

.panel.panel-default
    .panel-heading Pending Requests
    .panel-body
        table.table-hover.table-condensed
            thead
                tr
                    th Email
                    th First Name
                    th Last Name
            tbody
                - each val in pendingArray
                    tr(data-toggle='modal', data-id="#{val.mid}",  data-target="#mvrDisplayModal")
                        td #{val.email}
                        td #{val.fName}
                        td #{val.lName}

#mvrDisplayModal.modal.fade.large
    .modal-dialog(style="width:70%")
        .modal-content
            .modal-header
                button.close(type='button', data-dismiss='modal', aria-hidden='true') &times;
                h2.modal-title fName lName

            #orderDetails.modal-body

            .modal-footer
                button.btn.btn-default(type='button', data-dismiss='modal') Close


body
    script.
        $('#mvrDisplayModal').modal({
                keyboard: true,
                backdrop: "static",
                show: true,

            }).on('show', function(){
                var getIdFromRow = $(event.target).closest('tr').data('Email');
                $(this).find('#orderDetails').html($('<b> Order Id selected: ' + getIdFromRow + '</b>'))
            });
        });

已加载 JS 文件：

script(src="https://code.jquery.com/jquery-1.11.0.min.js")
script(src="https://code.jquery.com/jquery-migrate-1.2.1.min.js")
script(src="https://code.jquery.com/ui/1.10.4/jquery-ui.js")
script(src='/libs/bootstrap/js/bootstrap.min.js')

【问题讨论】：

标签： jquery twitter-bootstrap-3 pug

【解决方案1】：

问题出在 JavaScript 中

script.
$('body').on('show.bs.modal', '.modal', function () {
    var getIdFromRow = $(event.target).closest('tr').data('id');
    $(this).find('#orderDetails').html($('<b> Order Id selected: ' + getIdFromRow + '</b>'))
});

【讨论】：