MVC3 – 只有第一行链接适用于Jquery Modal Dialog
使用MVC3，Razor，Jquery，Javascript。 下面的代码循环显示一个包含字段和链接的表结构。 每行上的链接触发一个Jquery模式对话框，以弹出方式显示部分视图页面。 但弹出对话框仅适用于第一行…从第二行开始的链接，向下打开页面作为完整的网页，而不是弹出模式对话框。 如何解决这个问题…谢谢你的帮助。
@foreach (var item in Model) { @Html.DisplayFor(modelItem => item.Title) @Html.DisplayFor(modelItem => item.Category) @Html.ActionLink("Edit", "Edit", new { id = item.ID }, new { id = "modalEdit" }) | 这是Jquerymodal dialog代码。
$(document).ready(function () { //initialize the dialog $("#resultEdit").dialog({ modal: true, width: 300, resizable: true, position: 'center', title: 'Edit Information', autoOpen: false, open: function(event, ui) { $(".ui-dialog-titlebar-close").hide(); } }); }); $(function () { $('#modalEdit').click(function () { //load the content from this.href, then turn it into a dialog. $('#resultEdit').load(this.href).dialog('open'); return false; }); });
这可能是因为您的所有编辑链接都具有相同的ID！
这将使jquery行为高度无法预测！
为您的编辑链接提供一个共享类，如下所示：
@Html.ActionLink("Edit", "Edit", new { id = item.ID }, new { @class = "modalEdit" })
并将您的选择器更改为：
$('.modalEdit').click(function () {
尝试更改链接以使用类而不是ID。
例如
@Html.ActionLink("Edit", "Edit", new { id = item.ID }, new { @class = "modalEdit" })
和
$('.modalEdit').click(function () ...
您不能拥有具有相同ID的多个元素。
请改用类名。