打开相同的模态，多个按钮不起作用 [英] opening same modal with multiple buttons not working

问题描述

我有一个按钮点击打开的模态。问题是我有一个foreach语句来创建包含每行按钮的mutlipe行。当我点击它打开的第一个按钮，但似乎没有打开另一个：



模态：

Hi, I've got an modal that opens on a button click. problem is i've got an foreach statement to create mutlipe rows containing the button in each row. When i click on the first button it opens, but does not seem to open with the other:

Modal:

<script type="text/javascript">
    $(function () {
        $("#previewModal").dialog({
            autoOpen: false,
            height: 240,
            width: 240,
            modal: true,
            hide: {
                effect: "explode",
                duration: 400
            }
        });
        $("#openPreview").click(function () {
            $("#previewModal").dialog("open");
        });
    });
    $(function () {
        $("#previewModal").dialog("close");
    });
    </script>

<div id="previewModal">
</div>

foreach loop:
@foreach (var item in Model)
    {

        <tr>
            <td>
                @Html.Encode(item.IM)
            </td>
            <td>
                @Html.Encode(item.ProfileNumber)
            </td>
            <td>
            @Html.Encode(item.Description)</td>
            <td>
                @Html.Encode(item.StaffUser)
            </td>
            <td>
                <button id="openPreview">Preview</button>
                <button id="Approve">Approve</button>
            </td>
        </tr>
    }

[edit]已添加代码块[/ edit]

[edit]Code block added[/edit]

推荐答案

（function（）{

(function () {

（ ＃previewModal）。dialog（{
autoOpen： false ，
height： 240 ，
宽度： 240 ，
modal： true ，
隐藏：{
效果： explode，
持续时间： 400
}
}）;

("#previewModal").dialog({ autoOpen: false, height: 240, width: 240, modal: true, hide: { effect: "explode", duration: 400 } });

（ ＃openPreview）。click（function（）{

("#openPreview").click(function () {

这篇关于打开相同的模态，多个按钮不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！