Question

我有一个摄影对象列表，我将其传递到视图中： -

Public class Photography
{
    public Photography()
    {
        Name = "";
        Description = "";
        Category = "";
        ImgUrl = "";
        IsAccordion = false;
    }
    public string Name { get; set; }
    public string Description { get; set; }
    public string Category { get; set; }
    public string ImgUrl { get; set; }
    public bool IsAccordion { get; set; }
}

在我看来，我循环遍历这个列表：

@foreach (var item in Model.Photographys)
{
    <li class="span3" style="text-align: center">
        <div class="thumbnail thumbnail-1">
            <h3 style="margin-bottom: 10px;">@item.Name</h3>
            <div class="">
                <div class="">
                    <img src="@item.ImgUrl" alt="" style="visibility: visible; opacity: 1;">
                </div>
            </div>
            <section>
                <p>@item.Description</p>
                <a href="#" class="btn btn-1">Read More</a>
                <p>@item.IsAccordion</p>
            </section>
        </div>
    </li>
}

我想要的是拥有一个部分视图，让我可以编辑我点击的照片属性。我使用scaffoldoption“Edit”创建了一个局部视图。它看起来像这样：

@model aPhoto_web.Models.AdminPages.Photography

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
        <h4>Photography</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
            </div>
        </div>
}

等等......

我读到的大多数partialViews都会在父视图被渲染时直接渲染。这不是我想要的...我只希望在我以某种方式将Photo-object传递给它时出现partialView。

我知道这是一个“大问题”，但如果有人能指出我正确的方向那就太棒了！感谢。

编辑澄清：看看这个代码，我在循环的底部添加了一个“RenderPartial”。

@foreach (var item in Model.Photographys)
{
    <li class="span3" style="text-align: center">

        <div class="thumbnail thumbnail-1">
            <h3 style="margin-bottom: 10px;">@item.Name</h3>

            <div class="">
                <div class="">
                    <img src="@item.ImgUrl" alt="" style="visibility: visible; opacity: 1;">
                </div>
            </div>

            <section>                          
                <p>@item.Description</p>
                <a href="#" class="btn btn-1">Read More</a>
                <p>@item.IsAccordion</p>
            </section>
        </div>

        @{
            Html.RenderPartial("_editPhoto", item);
        }
    </li>
}

这为循环中的每个项目呈现部分视图。我想要一个方法将我点击的对象传递给部分...

编辑：

public ActionResult EditPhoto(string id)
{
    var photo = RavenSession.Load<ContentPage>(id) as Photography;
    return PartialView("_editPhoto", photo);  
}

Answer 1

首先，您必须添加一个控制器方法，该方法将摄影名称/ ID（如果您可以向摄影类添加ID属性更好）作为参数并返回您创建的部分视图。

然后，当您单击照片时，您可以使用Jquery将摄影名称/ ID传递给创建的控制器方法，您可以使用弹出窗口或页面内的特定元素（例如DIV）显示结果。

示例

当您在视图中循环摄影对象时，您可以向img标记添加类和ID属性，如下所示;

<img src="@item.ImgUrl" alt="" class="photography-image" data-imgId="@item.ID" style="visibility: visible; opacity: 1;">

然后使用jquery和jquery UI打开一个对话框以显示局部视图。请查看下面的示例代码。

$( ".photography-image" ).click(function() { e.preventDefault(); $("<div></div>") .addClass("dialog") .appendTo("body") .dialog({ close: function () { $(this).remove() }, modal: true, height: 500, width: 500 }) .load("/controler/method?photographyId=" + $(this).data("imgId")); });

谢谢！

将模型ID传递给部分视图以进行编辑

1 个答案: