从循环中发布表单数据

时间:2016-01-18 10:04:31

标签: javascript c# jquery ajax asp.net-core-mvc

我想在单击列表中的复选框时提交表单数据。目前我正在使用onclick事件,它不起作用,因为它发送一个get请求,我需要它发送一个post请求。

如何从循环内将两个参数发布到我的控制器方法中。

编辑从下面的评论我需要使用AJAX,因为我打算保持在同一页面上。我错误地认为发布请求会这样做。如果有人愿意用AJAX指出我正确的方向,那将是值得赞赏的。

以下是代码:

@for (var i = 0; i < Model.Count(); i++)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => modelItem[i].InvoiceID)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => modelItem[i].Description)                     
                </td>
                <td>
                    @Html.DisplayFor(modelItem => modelItem[i].InvoiceDate)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => modelItem[i].DueDate)
                </td>
                <td>                        
                    <input asp-for="@Model[i].Paid" onclick="location.href='@Url.Action("UpdatePaidStatus", "Billing", new { invoiceID = Model[i].InvoiceID, paid = Model[i].Paid })'" />                       
                </td>                   
            </tr>
        }

2 个答案:

答案 0 :(得分:1)

您可以使用jQuery创建自己的处理程序,从表单中收集所有数据,然后手动向控制器发帖或使用Ajax.BeginForm。 已发布了一些相关答案herehere

答案 1 :(得分:1)

根据您的评论,您希望在行中发布模型的invoiceID以及指示复选框状态的值。将你的HTML更改为

<input type="checkbox" class="status" value="@Model[i].InvoiceID />

并添加以下脚本

var url = "@Url.Action("UpdatePaidStatus", "Billing");
$('.status').click(function() {
  var id = $(this).val();
  var isPaid = $(this).is(':checked');
  $.post(url, { id: id, isPaid : isPaid }, function(data) {
    if (data) {
      // do something based on the data you return
    } else {
      // oops
    }
  }).fail(function() {
     // oops
  });
});

将发布到以下方法

[HttpPost]
public JsonResult UpdatePaidStatus(int ID, bool isPaid)
{
  // save something
  return Json(true); // or return Json(null) is it fails?
}

您没有说明当ajax调用成功或失败时您可能会发生什么,但是例如您可能更新DOM以显示指示成功或否则的消息。

旁注:这里可能没有必要使用ajax。如果您在每行中包含Model[i].InvoiceID的隐藏输入,并将正常表单提交到

public ActionResult UpdatePaidStatus(IList<yourmodel> model)

然后您的模型将与InvoiceIDPaid属性正确绑定,以便您可以在一个操作中更新集合中的所有项目。