Accessing IEnumerable List of values

Question

I have the following code

@model IEnumerable<Shop_Online.com.Models.Product>
<style type="text/css">
#Total_Products 
{
    width:20px;
    margin-left:10px;
}
</style>
@using (Html.BeginForm())
{
<div style="width: 860px; margin: 0 auto" class="main">
    <table border="1" style="font-family: Verdana; font-size: 13px">
        <tr style="background-color: #f2f2f2;height:30px">
            <th colspan="4">ITEM</th>
            <th>DELIEVERY DETAILS</th>
            <th>QTY</th>
            <th>SUB TOTAL</th>
            <th>Remove Items</th>
        </tr>
        @foreach (var item in Model)
        {
            <tr>
                <td colspan="4" style="width: 46%">
                    <table style="font-family: Verdana; font-size: 13px">
                        <tr>
                            <td>
                                <img src="@Url.Content(item.Photo)" alt="Image" style="width:36px" />
                            </td>
                            <td>
                                @Html.DisplayFor(x => item.Model_Name)
                            </td>
                        </tr>
                        <tr>
                            <td style="color: #ccc">30 days Replacement</td>
                        </tr>
                    </table>
                </td>
                <td style="width: 39%">Free Delievery Delivered in 2-3 business days.</td>
                <td style="width: 5%">@Html.TextBox("Total_Products",1)</td>
                <td style="width: 50%"><b>Rs. @Html.DisplayFor(x => item.Price)</b></td>
                <td><button type="submit" class="remove" value="@item.Id" id="@item.Id" name="Action">Remove</button></td>
            </tr>
        }
    </table>
    <div style="width: 100%; height: 70px; background-color: #f2f2f2">
        <div style="width: 75%; height: 70px; float: left; font-family: Verdana; font-size: 13px">
        </div>
        <div style="width: 25%; height: 70px; float: left; font-family: Verdana; padding-top: 20px; font-size: 13px">
            Estimated Price: <b>Rs.@ViewBag.total</b>
        </div>
    </div>
    <div class="order" style="width: 100%; height: 70px">
        <div class="left-order" style="width: 75%; height: 70px; float: left"></div>
        <div class="left-order" style="width: 25%; float: left; height: 70px">
            <input type="submit" name="Action" value="PLACE ORDER" style="border: 1px solid #ec6723; width: 216px; cursor: pointer; height: 45px; color: #fff; background: -webkit-linear-gradient(top,#f77219 1%,#fec6a7 3%,#f77219 7%,#f75b16 100%)" />
        </div>

    </div>
</div>

}

And here is the controller

public ActionResult Order(IEnumerable<Product> products, string Action)
    {
        if (Action == "PLACE ORDER")
        {
         //some code here
    }

Product Object

 public partial class Product
{
    public int Id { get; set; }
    public string Model_Name { get; set; }
    public string Company_Name { get; set; }
    public Nullable<int> Price { get; set; }
    public string Photo { get; set; }
    public string Big_Photo { get; set; }
    public string AlternateText { get; set; }
    public string Model_FullName { get; set; }
    public Nullable<int> Product_Id { get; set; }
    public string Video_record { get; set; }
    public string second_camera { get; set; }
    public string primary_camera { get; set; }
    public string touch_screen { get; set; }
    public string operating_sys { get; set; }
    public string warranty { get; set; }
    public Nullable<int> Company_Id { get; set; }
    public Nullable<int> Total_Products { get; set; }
}

I am getting null when I try to access the IEnumerable values . I am getting value for the Action variable. I even tried using for loop but still it doesn't work. I am able to display.This is something basic I am asking but I tried searching things on Google but weren't able to correct my mistake. Can anyone plz tell me how to correct the above code. Thanks

Answer 1

In order for the default MVC Model binding mechanism to recognize a collection of entities being submitted by the form in a POST, you will need to ensure that the names of the fields have a running zero based index in the name attribute of the Html elements which are posted back to the controller, e.g.:

@for (var i = 0; i < 10; i ++)
{
  <input type='text' name="products[@i].ProductId"/>
  <input type='text' name="products[@i].Total_Products">
  <br>
}

You have a couple of other options:

1. Build up a JSON array of the form elements and then post the array to the controller via AJAX
2. You could come up with your own naming mechanism and then either parse the FormCollection manually, or build a custom model binder

As an aside, you might want to change the name of your Action variable to avoid confusion with the Linq Action delegate