ASP MVC将视图中的模型数据作为表单数据传递回

Question

我得到了以下Razor视图，该视图显示了HDD列表，以便向用户添加并添加到购物车。 当用户按下HDD每行旁边的按钮时，它将把数量和HDD的身份传递给控制器​​。 但是，尽管每个HDD的ID都可以正确显示，但是当我检查控制器的参数时，“ hddId”始终为1，“ quantity”正确为5。

@model IEnumerable<TestStore.Models.Hdd>

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

<p>
    @Html.ActionLink("Create New", "Create")
</p>
@using(Html.BeginForm("AddToCart","Cart")){
<table>
    <tr>
        <th>
            Ident
        </th>
        <th>
            Brand
        </th>
        <th>
            Name
        </th>
        <th>
            Model
        </th>
        <th>
            Speed
        </th>
        <th>
            Capacity
        </th>
        <th>
            Cache
        </th>
        <th></th>
    </tr>

@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.hddId)
        </td>
        <td>
            @Html.Hidden("hddId", item.hddId)
            @Html.Hidden("quantity", 5)
            @Html.DisplayFor(modelItem => item.brand)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.name)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.model)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.speed)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.capacity)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.cache)
        </td>
        <td>
            <input type="submit" value="Add to Cart" />
        </td>
    </tr>

}

</table>
}

Answer 1

Codingbiz是正确的。 提交按钮不是指向任何特定的行，而是指向整个表。 我怀疑“ hddId”始终为“ 1”的原因是因为这是提交表单时看到的“ hddId”的第一个引用。 我将其更改为@using（Html.BeginForm（...））位于@foreach循环内，因此每一行都有自己的表单和提交按钮：

@foreach (var item in Model) {

    <tr>
        @using(Html.BeginForm("AddToCart","Cart")){
        <td>
            @Html.DisplayFor(modelItem => item.hddId)
        </td>
        <td>
            @Html.Hidden("hddId", item.hddId)
            @Html.Hidden("quantity", 5)
            @Html.DisplayFor(modelItem => item.brand)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.name)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.model)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.speed)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.capacity)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.cache)
        </td>
        <td>
            <input type="submit" value="Add to Cart" />
        </td>
        }
    </tr>
}

Answer 2

正如其他人所说，这是行不通的，因为在您提交时，您正在提交表中的每一行，而不仅仅是单击的行。

一种选择是执行他们在本文中建议的操作：

http://federmanscripts.com/2010/01/12/form-and-table-row-nesting-workaround/

也就是说，使用javascript，您可以将按钮按下时的表单值复制到隐藏行并提交。

Answer 3

我通过使用按钮type =“ submit”而不是输入type =“ submit”解决了验证问题。 通过将ID号传递给控制器​​，它仍然可以正常工作。

@using(Html.BeginForm("AddToCart","Cart")){
<table>
    <tr>
    //header stuff here
    </tr>

    @foreach (var item in Model) {
    //row data goes here
    //remove hidden field reference to @item.hddId
    <tr>
    <td>
        <button type="submit" value="@item.hddId" name="hddId">Add to Cart</button>
    </td>
    </tr>
</table>
}