MVC: Passing Value from View to Controller

Question

I am trying to pass values from a view to a controller in MVC. I am using a ViewModel and normally the values would bind to the properties as long as the names are the same. However because the values are generated via a foreach loop the names of the values do not match the names of the properties in the view model.

I am working around this by assigning the values to a variable in Razor. However one of my values is in a text box on the form and the value is not being passed to the controller and I cannot work out why.

I get a null exception when clicking the button.

VIEW Code is below:

@model PagedList.IPagedList<Mojito.Domain.ViewModels.ShoppingCartProductItem>
@using System.Web.UI.WebControls
@using PagedList.Mvc;
<link href="~/Content/PagedList.css" rel="stylesheet" type="text/css" />
@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Mojito Products</h2>

<table class="table">
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.FirstOrDefault().Description)
        </th>

        <th>
            @Html.ActionLink("Price", "Index", new { sortOrder = ViewBag.SortByPrice, currentFilter = ViewBag.CurrentFilter })
        </th>
        <th>
            @Html.DisplayNameFor(model => model.FirstOrDefault().Quantity)
        </th>
        <th>

        </th>

        <th></th>
    </tr>

    @foreach (var item in Model)
    {
        <tr>

            <td>
                @Html.DisplayFor(modelItem => item.Description)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Price)
            </td>
            <td>
                @Html.TextBoxFor(modelItem => item.Quantity)
            </td>


            <td>
                @{string Description = item.Description;}
                @{decimal Price = item.Price;}
                @{int Quantity = item.Quantity; }

                @using (Html.BeginForm("AddToCart", "ShoppingCart", FormMethod.Post))
                {
                    <div class="pull-right">
                        @if (Request.Url != null)
                        {
                            <input type="text" hidden="true" name="Description" value=@Description />
                            <input type="text" hidden="true" name="Price" value=@Price />
                            <input type="text" hidden="true" name="Quantity" value=@Quantity />
                            @Html.Hidden("returnUrl", Request.Url.PathAndQuery)
                            <input type="submit" class="btn btn-success" value="Add to cart" />
                        }

                    </div>
                }
            </td>
        </tr>
    }


</table>
<div class="col-md-12">
    Page @(Model.PageCount < Model.PageNumber ? 0 : Model.PageNumber) of @Model.PageCount
</div>
@Html.PagedListPager(Model, page => Url.Action("Index",
        new { page, sortOrder = ViewBag.CurrentSort, currentFilter = ViewBag.CurrentFilter }))

Controller Code below

public ActionResult AddToCart(Cart cart, MojitoProduct product, string returnUrl, int Quantity =1)
        {

            if (product != null)
            {
                cart.AddItem(product, Quantity);
            }
            return RedirectToAction("Index", new { returnUrl });
        }

Answer 1

Do not use foreach. Use a for-loop instead and within this, qualify the full path to your properties using the index.

Better yet: use a Edit- or DisplayTemplate for the ShoppingCartProductItem . This will also keep your path.

Answer 2

You have to use for loop instead of foreach:

@for (int i=0;i < Model.Count; i++)
{
        <tr>

            <td>
                @Html.DisplayFor(modelItem => Model[i].Description)
            </td>
            <td>
                @Html.DisplayFor(modelItem => Model[i].Price)
            </td>
            <td>
                @Html.TextBoxFor(modelItem => Model[i].Quantity)
            </td>
    ..........................
    ..........................
    ..........................
}

you can also post all using one form by posting List<ShoppingCartProductItem> , see Model Binding To A List

Answer 3

Your textboxes so values out of the form.

Try like below

@using (Html.BeginForm("AddToCart", "ShoppingCart", FormMethod.Post))
{
    @foreach (var item in Model)
    {
        <tr>

            <td>
                @Html.DisplayFor(modelItem => item.Description)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Price)
            </td>
            <td>
                @Html.TextBoxFor(modelItem => item.Quantity)
            </td>


            <td>
                @{string Description = item.Description;}
                @{decimal Price = item.Price;}
                @{int Quantity = item.Quantity; }


                    <div class="pull-right">
                        @if (Request.Url != null)
                        {
                            <input type="text" hidden="true" name="Description" value=@Description />
                            <input type="text" hidden="true" name="Price" value=@Price />
                            <input type="text" hidden="true" name="Quantity" value=@Quantity />
                            @Html.Hidden("returnUrl", Request.Url.PathAndQuery)
                            <input type="submit" class="btn btn-success" value="Add to cart" />
                        }

                    </div>

            </td>
        </tr>
    }
}

Answer 4

I resolved this in the short term by using new and forcing the name of the parameter.

@Html.HiddenFor(modelItem => t.NoOfUsers, new { Name = "NoOfUsers", id = "NoOfUsers" })