从表中显示模式对话框答案

【问题标题】：show modal dialog from table从表中显示模式对话框
【发布时间】：2016-09-12 07:39:21
【问题描述】：

在我的页面中，我试图显示一个 jquery 模式对话框，按下表格中的一个单元格。按项目不显示问题。我放了一个按钮，如果单击时它可以工作，但是由于表格不起作用。我还尝试添加以下代码：

<div data-toggle="modal" data-id="1" data-target="#orderModal" class="cal1">

此代码导致所有表格单元格显示相同的模式对话框，并且不希望这样。

我希望模态显示一些指定的单元格，而不是全部。所以我将代码添加到每个 td

<td data-toggle="modal" data-id="1" data-target="#orderModal" class="day past calender-day-2015-05-01"><div class="day-contents">1</div></td>

但不起作用，我相信它应该起作用。

感谢您提供有关如何解决此问题的帮助或建议。问候！

我的网络演示：http://pedregal09.co.nf/programa/index.html

这是我的模板代码： http://pastebin.com/raw/c9Y8awuh

【问题讨论】：

pastebin 链接失效

标签： jquery dialog modal-dialog

【解决方案1】：

您的 javascript 中有错误，您使用的事件变量未定义。您总是需要首先在浏览器中使用 javascript 控制台来检查 javascript 错误。

    $(function(){
        $('#orderModal').modal({
            keyboard: true,
            backdrop: "static",
            show:false
        }).on('show', function(event){
            var getIdFromRow = $(event.target).closest('tr').data('id');
            //make your ajax call populate items or what even you need
            $(this).find('#orderDetails').html($('<b> Order Id selected: ' + getIdFromRow  + '</b>'))
        });
    });

【讨论】：

【解决方案2】：

根据我在您的代码中看到的情况，当您单击一列时，您会触发模态两次。首先你有：

<div data-toggle="modal" data-id="1" data-target="#orderModal" class="cal1">

然后：

<td data-toggle="modal" data-id="1" data-target="#orderModal" class="day past calender-day-2015-05-01"><div class="day-contents">1</div></td>

从“div”中删除触发器，它将起作用。

【讨论】：