Html BeginCollectionItem 获取当前项目

Question

我需要：

访问/Client/Create
动态添加局部视图 (/Product/Card) 并将它们绑定到 Client.Products
在每个局部视图中，当我单击按钮时打开一个 bootstrap 模式 windows，我可以在其中设置产品信息
关闭模态并反映模态的变化反映在卡的产品中。

问题是：如何在另一个视图（除了卡片）中更改产品信息并反映到卡片的产品中？

@using (Html.BeginCollectionItem("Products"))
{
    @Html.HiddenFor(model => model.ClientID)
    @Html.HiddenFor(model => model.ProductID)


    <div class="card">
        <img class="card-img-top" src="http://macbook.nl/wp-content/themes/macbook/images/png/iphone318x180.png" alt="Grupo Logo">
        <div class="card-block">
            <h4 class="card-title">@Model.Name</h4>
            <p class="card-text">@Model.Desc</p>
            <div class="btn-group">
                <button type ="button" class="btn btn-primary open-modal" data-path="/Product/Edit/@Model.ProductID">Edit</button>
                <button type="button" class="btn btn-primary open-modal" data-path="/Product/Features/@Model.ProductID">Features</button>
            </div>
        </div>
    </div>

}

Answer 1

您可以在另一个视图中执行此操作（或者通过将另一个视图动态加载到模式中。该对象尚未创建，并且由于您使用 BeginCollectionItem() 生成新项目，因此您使用的任何其他视图不会使用该助手创建的相同 Guid，因此您将无法匹配集合项目。

相反，在局部中包含 'other' 属性，但将它们放在一个隐藏元素中，当您单击按钮时该元素会显示为模式。

adding/editing 产品的部分基本结构是

<div class="product">
    @using (Html.BeginCollectionItem("Products"))
    {
        @Html.HiddenFor(m => m.ClientID)
        @Html.HiddenFor(m => m.ProductID)
        <div class="card">
            ....
            <button type ="button" class="btn btn-primary edit">Edit</button>
        </div>
        // Modal for editing additional data
        <div class="modal">
            @Html.TxtBoxFor(m => m.SomeProperty)
            @Html.TxtBoxFor(m => m.AnotherProperty)
            ....
        </div>
    }
</div>

然后处理按钮 .click() 事件（使用委托，因为部分将动态添加到视图中）以显示关联的模态（假设您有一个 <div id="products"> 元素作为容器对于所有产品）

$('#products').on('click', '.edit', function() {
    var modal = $(this).closest('.product').find('.modal');
    modal.show(); // display the modal
});

Html BeginCollectionItem 获取当前项目

HtmlBeginCollectionItem Get Current Item

html-helper

asp.net-mvc-4

begincollectionitem