MVC Razor, How to keep Model object between Actions - asp.net-mvc

Question

I'm trying to display a product stock list.
I would like to let the user an option to edit the quantity's and the ability to remove a product from this list. the problem is, the Model object disappear after the submit action. i would like to preserve it, in order to update the stock in DB later on.
Controllers:
public ActionResult EditProducts()
{
//! Pulling DATA from db using DbContext
ProductDAL proDAL = new ProductDAL();
List<Products> pl = proDAL.Products.ToList<Products>();
ProductModel productModel = new ProductModel();
productModel.oneProduct = new Products();
productModel.ProductsCollection = new List<Products>();
productModel.ProductsCollection = pl;
TempData["pM"] = productModel;
return View("EditProducts", TempData["pM"]);
}
public ActionResult SubmitProductsValues(ProductModel productModel)
{
//! Some farther work to do...
return View("EditProducts", TempData["pM"]);
}
My View:
#using (Html.BeginForm("SubmitProductsValues", "Admin", FormMethod.Post))
{
<div class="col-xs-12 hclearfix edit">
<div class="col-xs-2 eRow et"><b>Product SKU</b></div>
<div class="col-xs-2 eRow et"><b>Product Name</b></div>
<div class="col-xs-2 eRow et"><b>Product Price</b></div>
<div class="col-xs-2 eRow et"><b>Product Quantity</b></div>
<div class="col-xs-2 eRow et"><b>Product Picture</b></div>
<div class="col-xs-1 eRow et"><b>pId</b></div>
<div class="col-xs-1 eRow et"><b>Remove?</b></div>
#{ int i = 0; }
#foreach (Products obj in Model.ProductsCollection)
{
<div class="col-xs-2 eRow">#Html.Raw(obj.SKU)</div>
<div class="col-xs-2 eRow">#Html.Raw(obj.Name)</div>
<div class="col-xs-2 eRow">#Html.Raw(obj.Price)</div>
<div class="col-xs-2 eRow">#Html.EditorFor(m=>m.ProductsCollection[i].Quantity)</div>
<div class="col-xs-2 eRow">#Html.Raw(obj.PicURL)</div>
<div class="col-xs-1 eRow">#Html.Raw(obj.Id)</div>
<div class="col-xs-1 eRow">#Html.CheckBox("remove")</div>
i++;
}
<div class="col-xs-12 eRow">
<p class="left">
<input type="submit" id="btnSubmit" value="Save Changes" />
</p>
<p class="alert-danger right">
#Html.ValidationSummary()
</p>
</div>
</div>
BTW, only this raw: #Html.EditorFor keeps the values of the returned data.
but i would like to avoid using #Html.EditorFor for the other fields, while
keeping those fields data.
Thank you so much for your help (:

Answer 1

You are getting null because the other field values are not in the form fields. Model binding will map the data from your form fields ( with names matching to your view model property name). Currently you are displaying Name, Price etc in just a div, not an input field.
But since you do not want to update any other fields, you should not worry about getting other field value as null. What you need is the unique Id of your record and the Quantity field value which has the updated value from form.
Als you do not need TempData. You can pass your model to the View method.
public ActionResult EditProducts()
{
var proDAL = new ProductDAL();
List<Products> pl = proDAL.Products.ToList<Products>();
ProductModel productModel = new ProductModel();
productModel.ProductsCollection = new List<Products>();
productModel.ProductsCollection = pl;
return View("EditProducts",productModel);
}
And in your view, you need to create input fields with names which matches the property name so that model binding will work when you post the form.
#model ProductModel
#using (Html.BeginForm("SubmitProductsValues", "Admin", FormMethod.Post))
{
<h2>Items</h2>
int i = 0;
foreach(var p in Model.Products)
{
<div>#p.Name</div>
<input type="hidden" name="ProductsCollection[#i].Id" value="#p.Id" />
<input type="text" name="ProductsCollection[#i].Quantity" value="#p.Quantity" />
}
<input type="submit" value="Update" />
}
Now in your HttpPost, you will have the ProductsCollection available withe updated data from the form user submitted.
[HttpPost]
public ActionResult SubmitProductsValues(ProductModel model)
{
// loop through model.ProductsCollection
foreach(var p in Model.ProductsCollection)
{
var q=p.Quantity;
var id=q.Id;
// to do : update quantity of the record for the value in Id variable.
}
// to do : Save and redirect
}

Answer 2

<input type="hidden" name="ProductsCollection[#i].SKU" value="#p.SKU" />
<input type="hidden" name="ProductsCollection[#i].Name" value="#p.Name" />
<input type="hidden" name="ProductsCollection[#i].Price" value="#p.Price" />
<input type="hidden" name="ProductsCollection[#i].PicURL" value="#p.PicURL" />
<input type="hidden" name="ProductsCollection[#i].Id" value="#p.Id" />
Thanks to #Shyju (: