在MVC 5中，如何将表对象数据作为列表传递给Controller View Model？

Question

My Controller ItemRequestViewModel is null & the issue is it didn't pass any value from view to controller but when i pass a List<string> it shows one Row Value. I just can't pass multiple object to Controllers ViewModel. i have tried by passing as a List<ItemRequestViewModel reqItem> as well but it seems no hope.

My Controller

public ActionResult ReqNotifyApprove(List<ItemRequestViewModel> reqItem)
{
   return null;
}

My View

@model IEnumerable<Management_System.ViewModels.ItemRequestViewModel>
@using (Html.BeginForm("ReqNotifyApprove", 
                       "RequestedItems", 
                       FormMethod.Post, 
                       new { id = "ReqItemApproveForm" }))
 {
    <table class="table table-bordered results">
        <thead>
            <tr>
                <th>ID</th>
                <th>ITEM ID</th>
                <th>DESCRIPTION</th>
                <th>UOM</th>
                <th>AVL QTY</th>
                <th>REQ QTY</th>
                <th>AUTH QTY</th>
            </tr>
        </thead>
        <tbody>
        @foreach (var item in Model)
        {
        <tr>
            <th>
                @Html.DisplayFor(modelItem => item.Id)
                @Html.HiddenFor(modelItem => item.Id, new { name = "Id" })
            </th>
            <th>
                @Html.DisplayFor(modelItem => item.PDT_CODE)
            </th>
            <td>
                @Html.DisplayFor(modelItem => item.PDT_NAME)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.UOM_SNAME)
            </td>

            <td>
                @Html.DisplayFor(modelItem => item.AvailableQty)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.ISS_QTY)
            </td>
            <td>
                <input type="number" id="ApprovedQuantity" name="ApprovedQuantity" class="form-control" min="0" style="width: 80px;">
            </td>
        </tr>
        }
        </tbody>
    </table>
<div>
    <input class="btn btn-lg btn-success" type="submit" value="Approve" />
</div>
}

I have already tried different Data binding as well but no hope.

Answer 1

The problem on your approach, is the name attribute that you fixed set to "Id". The way MVC binds a collection, is by adding "[index]" as a prefix to the HTML name attribute. You can find more details about it here - https://haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx/

So, if you remove this new { name = "Id" } , and use a for instead of foreach , your Razor will be something like:

@for (int i=0; i < Model.Count; i++)
{
    @Html.DisplayFor(modelItem => Model[i].Id)
    @Html.HiddenFor(modelItem => Model[i].Id)
    ....
}

And the result of the hidden input should be something like:

<input type='hidden' name="[0].Id" id="0__Id" />
<input type='hidden' name="[1].Id" id="1__Id" />
<input type='hidden' name="[2].Id" id="2__Id" />