将参数传递给模态数据

时间:2017-06-07 09:13:30

标签: c# asp.net

我在ASP.NET中使用c#,我有以下疑问:

我希望传递“ContentID”(当我点击按钮“详细信息”时)到模态窗口。

@model IEnumerable<SoftIdeiaProject.Models.DB.Content>



@{
    ViewBag.Title = "Details";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Details</h2>


@Html.ActionLink("Create New", "CreateContent", Url.RequestContext.RouteData.Values)
<table class="table">
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.Name)
        </th>
        <th></th>
    </tr>

    @foreach (var _item in Model)

    {

        <tr>
            <td>
                @Html.DisplayFor(modelItem => _item.Name)
            </td>

            <td>
                @if (System.Web.HttpContext.Current.User.Identity.IsAuthenticated)
            {
                    <button type="button" class="btn btn-default"> @Html.ActionLink("Delete", "DeleteContent", new { id = _item.ContentID }) </button>
                    <button type="button" class="btn btn-default"> @Html.ActionLink("Edit", "AddVideo", new { id = _item.ContentID }) </button>
                    <button type="button" class="btn btn-default"> @Html.ActionLink("Add Video", "AddVideo", new { id = _item.ContentID }) </button>
                }
                <button type="button" class="btn btn-default" data-toggle="modal"  data-target="#myModal" data-id="content_id_value">Details</button>



            </td>
        </tr>


    }
</table>
@foreach (var _item in Model)
{
    <div class="modal fade" id="myModal" role="dialog">
        <div class="modal-dialog">

            <!-- Modal content-->
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">@Html.DisplayFor(modelItem => _item.Name)</h4>
                </div>
                <div class="modal-body">
                    <p>@Html.DisplayFor(modelItem => _item.Description)</p>

                    <p><img class="img-responsive" src="~/images/@_item.Image" /></p>
                    <p><video width="400" src="~/video/@_item.VideoID" controls/></p>
                        
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div>

        </div>
    </div>
}
 

 

更具体一点: enter image description here

当我点击“最后”的“详细信息”时,我希望模态上的数据与“PesquisaRápida”不同,但我不能这样做。

1 个答案:

答案 0 :(得分:0)

假设您的模型中有一个ContentId字段,为每一行生成唯一按钮,而不是data-target="#myModal"使其成为data-target="#myModal_@item.ContentId"

详细信息按钮应如下所示:

<button type="button" class="btn btn-default" data-toggle="modal"  data-target="#myModal_@_item.ContentId"   data-id="@_item.ContentId">Details</button>

现在在你的第二个foreach循环中,而不是

<div class="modal fade" id="myModal" role="dialog">

让它独一无二

<div class="modal fade" id="myModal_@_item.ContentId" role="dialog">

现在你知道每个PopupId中的ContentId。

注意:我强烈建议只使用一个弹出窗口,然后只需修改详细信息按钮内的数据。您也可以使用ajax从服务器获取数据&amp;将它绑定在onSuccess上。

Refer here for a Way to achieve modal popup in MVC