How to pass two same object from view to controller - asp.net-mvc

Question

I have a panel like below:
and the view code is:
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingFour">
<h4 class="panel-title">
<a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
Product Details
</a>
</h4>
</div>
<div id="collapseFour" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingFour">
<div class="panel-body">
<a class="btn btn-lg btn-primary btn-add-panel" > <i class="glyphicon glyphicon-plus"></i> Add new Product</a>
<div id="propanel"></div>
<br />
<div class="panel panel-default template" >
<div class="panel-heading">
<span class="glyphicon glyphicon-remove-circle pull-right "></span>
<h4 class="panel-title">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapse5">
New Product
</a>
</h4>
</div>
<div id="collapse5" class="panel-collapse collapse">
<div class="panel-body">
<div class="form-group">
#Html.LabelFor(model => model.JobProduct.Detail, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.JobProduct.Detail, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.JobProduct.Detail, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.JobProduct.UnitPrice, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.JobProduct.UnitPrice, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.JobProduct.UnitPrice, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.JobProduct.Count, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.JobProduct.Count, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.JobProduct.Count, "", new { #class = "text-danger" })
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
this panel maybe has one product or more.in viewmodel i get an object of product type.i want to create list in view of product inserted and pass that to controller as a list.actually i want to create list in view and add object in in it.
how can i get product inserted and send as a list to controller?

Answer 1

Your base class:
public class JobProduct
{
public string Detail{get;set;}
public decimal UnitPrice{get;set;}
public int Count{get;set;}
}
Model class:
public class JobList
{
public IEnumerable<JobProduct> JobProductList { get; set; }
}
Pass the JobProductList from get method to view:
#for (int i = 0; i < Model.JobProductList.length; i++)
{
<div id="collapse#(i+1)" class="panel-collapse collapse">
<div class="panel-body">
<div class="form-group">
#Html.LabelFor(model => model.JobProductList[i].Detail, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.JobProductList[i].Detail, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.JobProductList.Detail, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.JobProductList[i].UnitPrice, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.JobProductList[i].UnitPrice, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.JobProductList[i].UnitPrice, "", new { #class = "text-danger" })
</div>
</div>
<div class="form-group">
#Html.LabelFor(model => model.JobProductList[i].Count, htmlAttributes: new { #class = "control-label col-md-2" })
<div class="col-md-10">
#Html.EditorFor(model => model.JobProductList[i].Count, new { htmlAttributes = new { #class = "form-control" } })
#Html.ValidationMessageFor(model => model.JobProductList[i].Count, "", new { #class = "text-danger" })
</div>
</div>
</div>
</div>
}
Your final Create post method should accept the enumarable list:
[HttpPost]
public ActionResult Create(IEnumerable<JobProductlist> job)
{
return View(job);
}