我有一个ViewModel,其中包含我的模型列表,如下所示:
public class OrderConfirm
{
public ICollection<DayBookQuoteLines> SalesLines { get; set; }
public ICollection<DayBookQuoteLines> LostLines { get; set; }
public string Currency { get; set; }
}
然后,我在我的视图中使用此视图模型,如下所示:
@model btn_intranet.Areas.DayBook.Models.ViewModels.OrderConfirm
@{
ViewBag.Title = "Daybook - Order Confirmation";
}
<h6>Sales Lines</h6>
<div id="SalesOrders">
@using (Ajax.BeginForm("ConfirmSalesOrder", new AjaxOptions()
{
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "SalesOrders",
OnBegin = "SalesOrderConfirm"
}))
{
@foreach(var item in Model.SalesLines)
{
<p>@item.ItemName</p>
<p>@item.Qty</p>
@* Other Properties *@
}
<input type="submit" value="Submit Sales Order" />
}
</div>
<h6>Lost Lines</h6>
<div id="LostOrders">
@using (Ajax.BeginForm("ConfirmLostOrder", new AjaxOptions()
{
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "LostOrders",
OnBegin = "LostOrderConfirm"
}))
{
@foreach(var item in Model.SalesLines)
{
<p>@item.ItemName</p>
<p>@item.Qty</p>
@* Other Properties *@
}
<input type="submit" value="Submit Lost Order" />
}
</div>
问题是,在我的[HttpPost]
行动中,既ConfirmSalesOrder
又ConfirmLostOrder
.作为参数传递的模型的值为空:
[HttpPost]
public ActionResult ConfirmSalesOrder(List<DayBookQuoteLines> quoteLines)
{
// Process order...
return PartialView("Sales/_ConfirmSalesOrder");
}
所以quoteLines
是空的。如何将表单绑定到我的模型?
表单中没有任何将值发送到服务器的输入字段。您只是显示它们。这就是为什么当您提交表单 => 没有任何东西发送到服务器时,它们是空的。
但是,如果在此表单中,用户不应该修改任何值,您需要做的就是将 id 传递给控制器操作,该操作将允许您从您在呈现此表单的 GET 操作中获取模型的完全相同的位置获取模型。
在这种情况下,您的操作将如下所示:
[HttpPost]
public ActionResult ConfirmSalesOrder(int id)
{
List<DayBookQuoteLines> quoteLines = ... fetch them the same way as in your GET action
// Process order...
return PartialView("Sales/_ConfirmSalesOrder");
}
另一方面,如果用户应该修改表单中的值,您需要为他提供必要的输入字段:文本框、复选框、单选按钮、下拉列表、textereas 等......为了为这些输入字段生成正确的名称,我建议您使用编辑器模板,而不是在视图中编写foreach循环。
更新:
似乎用户不应该编辑数据,因此没有相应的输入字段。在这种情况下,为了保留模型,您可以在 AJAX 请求期间将Ajax.BeginForm
替换为普通Html.BeginForm
然后手动将 AJAX 请求与 jQuery 连接起来。这种方法的优点是,现在您可以拥有更多的控制权,例如,您可以将整个模型作为 JSON 请求发送。为此,您可以将模型存储为视图中的javascript编码变量:
<script type="text/javascript">
var model = @Html.Raw(Json.Encode(Model));
</script>
然后 AJAXify 表单:
$('#formId').submit(function() {
$.ajax({
url: this.action,
type: this.method,
contentType: 'application/json',
data: JSON.stringify({ quoteLines: model }),
success: function(result) {
$('#someTargetIdToUpdate').html(result);
}
});
return false;
});