HtmlBeginCollectionItem Получить текущий элемент

Question

Я нуждаюсь:

1. Доступ / Клиент / Создать
2. Добавьте динамически частичные представления (/Product/Card) и привяжите их к клиенту.
3. В каждом частичном представлении, когда я нажимаю на кнопку, открываются модальные окна начальной загрузки, где я могу установить информацию о продукте.
4. Закройте модальные и отразите изменения модальных отражений в Продукте Карты.

Проблема заключается в следующем: как изменить информацию о продукте в другом представлении (кроме карты) и отразить на продукте карты?

@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 созданный этим помощником, так что вы не сможете сопоставить элементы коллекции.

Вместо этого, включите "другие" свойства в партиал, но поместите их в скрытый элемент, который отображается как модальный при нажатии кнопок.

Базовая структура партиала для добавления / редактирования Продукта будет

<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
});