使用“对话框”仅帮助打开一个元素MVC 环境下 JQuery (UI) 中的函数

Question

大家好，如果我遗漏了任何细节，请提前原谅我，因为这是我在这里的第一篇文章：

我在使用对话框 JQuery 命令时遇到问题。更具体地说，我希望名为“编辑”的按钮（下面第 7 行）仅打开 1 个窗口，而不是所有窗口都在彼此后面。下面是我现在使用的一些代码以及该代码发生的情况的简短描述。预先感谢您的阅读！

<!-- C# and HTML code here-->
<table> 
<tbody>
        <% foreach (var item in Model) { %>
    <tr>
    <td>    
                <button class="opener">Edit</button>
                <div class="dialogButton" title="Something"><% Html.RenderAction("Something", "Admin", new { id = item.ID }); %></div>
                 <td>Other values</td>
                  </tr>
</table>

<!-- JQ script is here-->
$(".dialogButton").dialog({ autoOpen: false });
            $(".dialogButton").dialog({ buttons: { "Ok": function () { $(this).dialog("close"); } } });
            $(".dialogButton").dialog({ show: 'fade' });
            $('.opener').click(function () { $('.dialogButton').dialog('open'); });

到目前为止，应用程序所做的是加载表格，并在每行旁边有一个编辑按钮（上面第 7 行），但是当按下“编辑”按钮时，Html.RenderAction（第 8 行）会拉出所有行的编辑窗口。列表中的项目 (item.ID)，而不仅仅是选定的一行。这意味着目前大约有 25 个窗口在彼此后面弹出。

我希望代码执行的操作但到目前为止无法弄清楚只是打开所选行的编辑窗口。

还建议将上面代码中的最后一行（最后一行 17 行）替换为以下代码：

$('.opener').click(function () { $(this).next().dialog('open'); });

理论上，这应该只打开一个元素，但事实并非如此。请帮忙！

再次感谢您！

Answer 1

只需为每个 div class="dialogBu​​tton" 和按钮 class="opener" 添加唯一 ID，

例如 div class="dialogBu​​tton" id="DialogBu​​tton_1" 和
Button class="opener" id="opener_1。使用 item.ID 或其他唯一的东西。

然后使用 ID

$('.opener').click(function () { $('#dialogBu​​tton_ '+$(this).attr('id')).dialog('open'); });

基本上，您将通过这种方式调用对应于 opener 的对话框

希望这对您来说听起来合乎逻辑。