如何解决MVC3-只有第一行链接可与Jquery Modal Dialog一起很好地工作
|| 使用MVC3,Razor,Jquery,Javascript。下面的代码循环并显示带有字段和链接的表结构。每行上的链接会触发一个“ jQuery模式对话框”,该对话框将部分视图页面显示为弹出窗口。但是,弹出对话框仅适用于第一行...第二行中的链接向下打开页面作为完整的网页,而不是弹出的模式对话框。如何解决此问题。感谢您的帮助。@foreach (var item in Model) {
<tr>
<td>
@Html.DisplayFor(modelItem => item.Title)
</td>
<td>
@Html.DisplayFor(modelItem => item.Category)
</td>
<td>
@Html.ActionLink(\"Edit\",\"Edit\",new { id = item.ID },new { id = \"modalEdit\" }) |
</td>
</tr>
这是“ jQuery模式对话框”代码。
<script type=\"text/javascript\">
$(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\",new { @class = \"modalEdit\" })
和
$(\'.modalEdit\').click(function () ...
, 您不能有多个具有相同ID的元素。
请改用类名。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。