部分视图中的 MVC3 表单



我正在寻找在MVC3,JQuery AJAX中完成以下任务的最佳方法:

我有一个购物车,可以在其中为购物车中的每种产品输入不同的船地址。这个想法是让这个船在每个产品下面形成,还有一个保存按钮,并通过JQuery AJAX提交。

我一直在尝试这样做的方法是将窗体放在部分视图中(以及 Html.BeginForm 和提交 SAVE 按钮),然后将部分视图呈现在视图上的 foreach 循环中(将视图模型项传递给部分视图窗体)。

购物车

中的第一个产品一切正常,但是当我尝试为购物车中的第二个或第三个产品输入并提交任何其他表单地址时,我实际上从第一个产品中获取了 ID 并更新了该 ID。

通过Google阅读,我找到了有关模型绑定到表单的文章,但是对于这些情况,我在foreach循环之前有一个整体的Html.BeginBeginForm,只有一个提交按钮。如何为每个产品下的每个表单设置一个提交(保存)按钮,并通过 AJAX 调用提交?

成千上万的人提前感谢你!!

更新:

也许为了更好地描述我在这里所做的事情,举个例子:

在Cart.cshtml,主视图中,我有:

@foreach (var item in Model.CartItems)
{
   @Html.Partial("ShipToAddress", new AddressViewModel(item.CartDetailsId))
}

然后在ShipToAddress.cshtml(部分视图)中,我有:

@using (Html.BeginForm("SaveShipToAddress", null, FormMethod.Post))
{ 
  @Html.HidenFor(model => model.ItemId)
  @Html.TextBoxFor(model => model.Name)
  @Html.TextBoxFor(model => model.Address)
  <input type="submit" value="Save" id="saveShipToAddress" />
}

然后我有链接到此表单的 jquery 脚本文件,并通过 AJAX 提交它。

我认为我的问题是表单位于部分视图中,因此当它生成时,购物车中的所有项目都具有相同的 ID。

谢谢!

使用 jQuery serialize 方法序列化表单的该部分并将其发送到操作方法。您仍然可以在那里执行模式绑定。您可以在保存按钮单击事件上执行类似操作。

$.post("Yourcontroller/YourAction", $("#formId").serialize() ,function(data){
  //do whatever with the response
});

如果其他人需要做类似的事情,我最终通过在表单中添加 itemId 属性来解决这个问题:

@using (Html.BeginForm("SaveShipToAddress", null, FormMethod.Post, new { @class = "frmShipToAddress", itemId = Model.ItemId.ToString() }))

然后是我抓取的jquery文件:

var shipAddress = {   
itemId: form.attr('itemId'),
name: form.find('input[name="Name"]').val(),
address: form.find('input[name="Address"]').val() }
var jsonData = JSON.stringify(shipAddress);

并将 jsonData 传递给 ajax 调用,然后在控制器中接收该调用,并且由于使用了视图模型对象而正确解析。

最新更新