我正在为我的问题寻找解决方案。
我正在使用 MVC Razor 创建网站。
在产品列表中,我想打开一个弹出窗口(Jquery 对话框),其中可以打开部分视图。
但我无法让它工作。
这就是我所拥有的:
<table style="width:100%;" cellpadding="0" cellspacing="10" >
<tr>
<th>Acties</th>
<th>Code</th>
<th>omschrijving</th>
<th>Status</th>
<th>Afbeeldingen</th>
</tr>
@foreach (var item in Model)
{
Product P1 = item.Product_1;
Product P2 = item.Product_2;
<tr>
<td>
@Html.ActionImage("AddMedia", "Upload", new { id = P1.ProductId }, "../Site_images/New Document.png", 20, 20, "Afbeelding toevoegen")
@Html.ActionImage("Details", "Products", new { id = P1.ProductId }, "../Site_images/Get Info Blue Button.png", 20, 20, "Details")
@Html.Image("Site_images/Appointment Cool.png", 20, 20, "Reserveren")
<button value='@P1.ProductId' id="opener">open the dialog</button>
</td>
<td>@P1.ProductCode</td>
<td>@P1.Description</td>
<td></td>
<td>@P1.Media.Count()</td>
</tr>
if (P2 != null)
{
<tr>
<td>
</td>
<td>@P2.ProductCode </td>
<td>@P2.Description</td>
<td></td>
<td>@P2.Media.Count()</td>
</tr>
}
}
</table>
<div id="dialog" title="Dialog Title">I'm a dialog</div>
<script type="text/javascript">
var TheValue;
$(function () {
$('#dialog').dialog({
autoOpen: false,
width: 400,
resizable: false,
title: 'Details',
modal: true,
open: function (event, ui) {
$(this).load('@Url.Action("AddMedia", "Upload", new { id = " + TheValue + "})');
},
buttons: {
"Close": function () {
$(this).dialog("close");
}
}
});
$('#opener').click(function () {
$('#dialog').dialog('open');
TheValue = $(this).attr("value");
});
});
如您所见,我已将产品 ID 传递给每个按钮(作为值)现在,我想要做的是,当您单击按钮时,按钮的值将传递给 Dialog open 事件,因此部分view 将显示所选产品的数据。
希望有人可以提供帮助。