为什么这个按钮在ASP.NET MVC CSS中显示在上面的表格下面

时间:2016-03-26 10:30:18

标签: c# html css asp.net-mvc

我不知道为什么,但是当我运行应用程序时,此按钮显示在上面的表格中。此按钮应位于此表下方。我该如何解决这个问题?

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

    @using (Html.BeginForm())
    {
        @Html.ValidationSummary("", new { @class = "text-danger" })
        <br />
        for (var i = 0; i < Model.MyList.Count; i++)
        {
            <tr>
                <td>
                    @Html.DisplayFor(model => model.MyList[i].Name)
                    @Html.HiddenFor(model => model.MyList[i].Name)
                </td>
                <td>
                    @Html.TextBoxFor(model => model.MyList[i].Amount)
                    @Html.HiddenFor(model => model.MyList[i].Amount)
                </td>
            </tr>

        }
        <input type="submit" value="Confirm" class="btn btn-success" />
    }
</table>

1 个答案:

答案 0 :(得分:1)

试试这个。您正在将表格代码与Html的其余部分混合

@using (Html.BeginForm())
{
    @Html.ValidationSummary("", new { @class = "text-danger" })
    <br />
    <table class="table">
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.MyList.FirstOrDefault().Name)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.MyList.FirstOrDefault().Amount)
            </th>
        </tr>


        @for (var i = 0; i < Model.MyList.Count; i++)
        {
            <tr>
                <td>
                    @Html.DisplayFor(model => model.MyList[i].Name)
                    @Html.HiddenFor(model => model.MyList[i].Name)
                </td>
                <td>
                    @Html.TextBoxFor(model => model.MyList[i].Amount)
                    @Html.HiddenFor(model => model.MyList[i].Amount)
                </td>
            </tr>
        }
    </table>
    <input type="submit" value="Confirm" class="btn btn-success" />
}