MVC4 - 如何在表行中使用提交按钮

时间:2014-08-06 15:29:15

标签: asp.net-mvc-4 post tablerow

我有一个表,每行中有一个提交按钮,我想通过HTTP POST提交该行的数据。我写了我的代码,但表单没有渲染。我试图渲染每一行的形式,所以我可以传递行值。我正在使用GridMVC来渲染我的表。

查看

@model Business.Models.Administration.StatsImerptsViewModel
@using GridMvc.Html

    <h2>Application Stages portal</h2>

    <table>
        <tr>
            <td>
                IMechE Date:
            </td>
            <td>@Html.DropDownListFor(m => m.IMecheData, Model.ListOfYears)
            </td>
            <td>
                <input type="submit" value="View/Amend" />
            </td>
        </tr>
    </table>
    <br />

    <div id="grid-wrap" style="width: 500px;">
        @Html.Grid(Model.CouncilRegistrationReports).Named("ApplicationsGrid").Columns(columns =>
   {
       columns
  .Add()
  .Titled("Start Date")
  .Filterable(true)
  .Format("{0:dd/MM/yyyy}")
  .Encoded(false)
  .Sanitized(false)
  .SetWidth(30)
  .RenderValueAs(m =>

     @Html.TextBoxFor(t => m.StartDate, "{0:dd/MM/yyyy}", new { @class = "datepicker" })
  );
       columns
 .Add()
 .Titled("End Date")
 .Filterable(true)
 .Format("{0:dd/MM/yyyy}")
 .Encoded(false)
 .Sanitized(false)
 .SetWidth(30)
 .RenderValueAs(m =>

   @Html.TextBoxFor(t => m.EndDate, "{0:dd/MM/yyyy}", new { @class = "datepicker" })
 );

       columns
.Add()
.Titled("Date sent to EC")
.Filterable(true)
.Format("{0:dd/MM/yyyy}")
.Encoded(false)
.Sanitized(false)
.SetWidth(30)
.RenderValueAs(m =>

  @Html.TextBoxFor(t => m.ECDate, "{0:dd/MM/yyyy}", new { @class = "datepicker" })
);
       columns
.Add()
.Titled("CEng")
.Filterable(true)
.Encoded(false)
.Sanitized(false)
.SetWidth(30)
.RenderValueAs(m =>

@Html.TextBoxFor(t => m.CEng)
);
       columns
.Add()
.Titled("IEng")
.Filterable(true)
.Encoded(false)
.Sanitized(false)
.SetWidth(30)
.RenderValueAs(m =>

@Html.TextBoxFor(t => m.IEng)
);

       columns
.Add()
.Titled("EngTech")
.Filterable(true)
.Encoded(false)
.Sanitized(false)
.SetWidth(30)
.RenderValueAs(m =>

@Html.TextBoxFor(t => m.EngTech)
);
       columns
  .Add()
  .Encoded(false)
  .Sanitized(false)
  .SetWidth(30)
  .RenderValueAs(m =>

      @<b>
    @*  @Html.ActionLink("Update", "UpdateStatsImerpts", routeValues: new { Id = m.Id, StartDate = m.StartDate, EndDate = m.EndDate, ECDate = m.ECDate, CEng = m.CEng, IEng = m.IEng, EngTech = m.EngTech },
                               htmlAttributes: new { onclick = "", Id = m.Id })*@

                               @using (Html.BeginForm("StatsImerpts", "Administration", new { m = m }))
                               {
                                    <input type="submit" value="Update" />
                               }
      </b>
  );
       columns
       .Add()
       .Encoded(false)
       .Sanitized(false)
       .SetWidth(30)
       .RenderValueAs(m =>

           @<b> <a href="@Url.Action("DeleteStatsImerpts", "Administration", routeValues: new { Id = m.Id })" id="@m.Id">
               <img src="../../Images/delete.gif" alt="Delete" />
           </a></b>
  );

   }).WithPaging(50)
    </div>

    <script>
        $(function () {
            $(".datepicker").datepicker({
                changeMonth: true,
                changeYear: true
            });
        });
    </script>

HTML我尝试使用html.beginForm()

@Html.TextBoxFor(t => m.EngTech)
);
       columns
  .Add()
  .Encoded(false)
  .Sanitized(false)
  .SetWidth(30)
  .RenderValueAs(m =>

      @<b>
    @*  @Html.ActionLink("Update", "UpdateStatsImerpts", routeValues: new { Id = m.Id, StartDate = m.StartDate, EndDate = m.EndDate, ECDate = m.ECDate, CEng = m.CEng, IEng = m.IEng, EngTech = m.EngTech },
                               htmlAttributes: new { onclick = "", Id = m.Id })*@
                           @using (Html.BeginForm("StatsImerpts", "Administration", new { m = m }))
                           {
                                <input type="submit" value="Update" />
                           }
  </b>

);

以前有人试过这样做吗?我知道我可以使用javascript并将行的所有值传递给函数但是如果我可以执行POST并传递行值,我认为这会更简单。

1 个答案:

答案 0 :(得分:0)

我不熟悉GridMvc,但我之前为购物车做了类似的事情(更新数量或删除项目),我最终使用javascript将POST发送到控制器中的一个Action&# 39; s Id和新数量。

编辑:查看如何使用AJAX进行POST,看看会出现什么。有许多类似的例子可能有所帮助。另请参阅此帖子here,特别是使用XMLHttpRequest的示例。