asp.net mvc 4 - HtmlBeginCollectionItem Get Current Item -

i need:

1. acess /client/create
2. add dynamically partial views (/product/card) , bind them client.products
3. in each partial view when click in button open bootstrap modal windows can set product's information
4. close modal , reflect changes of modal reflect in card's product.

the problem is: how change product informations in view(other card) , reflect product of card?

@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>  } 

you can view (or dynamically loading view modal. object has not been created yet, , since using begincollectionitem() generate new items, other view used not using same guid created helper not able match collection items.

instead, include 'other' properties within partial, put them in hidden element gets displayed modal when click buttons.

the basic structure of partial adding/editing product be

<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 editing additional data         <div class="modal">             @html.txtboxfor(m => m.someproperty)             @html.txtboxfor(m => m.anotherproperty)             ....         </div>     } </div> 

and handle buttons .click() event (using delegation since partials dynamically added view) display associated modal (assumes have <div id="products"> element container products)

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