将对象从 PartialView 传递到 Controller
Pass objects from PartialView to Controller
下面是我正在处理的 View
的 html。它包含一个 table 可以根据需要添加额外的行。在返回这个特定的 View
.
时,table 最初填充了一个 SalesOrder
对象
@model List<Project.Models.SalesOrder>
@{
Layout = "~/Views/Shared/_Layout.cshtml";
}
@using (Html.BeginForm("Print", "Project", FormMethod.Post))
{
<div class="col-lg-12">
<table class="table table-striped">
<thead>
<tr>
<th>SO#</th>
<th>Cust#</th>
<th>DC</th>
<th>Stop</th>
<th>Addr L1</th>
<th>Addr L2</th>
<th>City</th>
<th>State</th>
<th>Zip</th>
<th>Ref 1</th>
<th>Ref 2</th>
<th>Pcs</th>
</tr>
</thead>
<tbody>
@foreach (var salesOrder in Model)
{
@Html.Partial("_SalesOrderRecord", salesOrder)
}
</tbody>
</table>
</div>
<div class="col-lg-12">
<button type="button" class="btn btn-primary" id="add">Add</button>
<button type="button" class="btn btn-danger" id="delete">Remove Last Record</button>
<button style="float: right;" type="submit" class="btn btn-danger" id="print">Print Label(s)</button>
</div>
}
单击“添加”按钮后,将调用下面的脚本,并在 table 的 foreach
中添加一个 PartialView
。
var url = '@Url.Action("Add", "ProjectController")'; // adjust to suit
$('#add').click(function() {
$.get(url, function (response) {
$('<tr />').html(response).appendTo(tableBody);
});
});
下面是PartialView
:
@model Project.Models.SalesOrder
@using (Html.BeginCollectionItem("salesOrderTbl"))
{
<tr id="addRow" class="form-group">
@Html.HiddenFor(m => m.SalesOrderId)
<td>@Html.TextBoxFor(m => m.SalesOrderNumber, new {@class="form-control", @style="height: auto; width: 5em;"})</td>
<td>@Html.TextBoxFor(m => m.CustId, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.Location, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.DeliveryCompanyName, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.AddressL1, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.AddressL2, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.City, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.State, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.Zip, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.Reference1, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.Reference2, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.Pieces, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
</tr>
}
我要完成的下一步是使用“打印”按钮post将 SalesOrder
对象发送到我的 ProjectController
。
下面是我正在尝试 post 的 ProjectController
方法:
[HttpPost]
public ActionResult Print(List<SalesOrder> salesOrders)
{
//do things
}
不幸的是,这对我不起作用,salesOrder
列表对象始终为空。我相信我误解了如何使用 PartialView
所以如果有人能指出我哪里出错了,我将不胜感激。
您的部分使用 BeginCollectinItem()
添加名为 "salesOrderTbl"
的前缀,为了绑定,您的 POST 方法中的参数名称必须匹配。
[HttpPost]
public ActionResult Print(List<SalesOrder> salesOrderTbl)
或者,保留现有的方法参数名,将部分中的视图代码更改为
@using (Html.BeginCollectionItem("salesOrders"))
{
....
}
另请注意,您的部分正在创建一个 <tr>
元素,因此您不需要将其包含在用于动态添加新行的脚本中的另一个 <tr>
元素中。应该只是
var tableBody = $('#...'); // give your tbody an id
var url = '@Url.Action("Add", "ProjectController")'; // adjust to suit
$('#add').click(function() {
$.get(url, function (response) {
$(tableBody').append(response);
});
});
下面是我正在处理的 View
的 html。它包含一个 table 可以根据需要添加额外的行。在返回这个特定的 View
.
SalesOrder
对象
@model List<Project.Models.SalesOrder>
@{
Layout = "~/Views/Shared/_Layout.cshtml";
}
@using (Html.BeginForm("Print", "Project", FormMethod.Post))
{
<div class="col-lg-12">
<table class="table table-striped">
<thead>
<tr>
<th>SO#</th>
<th>Cust#</th>
<th>DC</th>
<th>Stop</th>
<th>Addr L1</th>
<th>Addr L2</th>
<th>City</th>
<th>State</th>
<th>Zip</th>
<th>Ref 1</th>
<th>Ref 2</th>
<th>Pcs</th>
</tr>
</thead>
<tbody>
@foreach (var salesOrder in Model)
{
@Html.Partial("_SalesOrderRecord", salesOrder)
}
</tbody>
</table>
</div>
<div class="col-lg-12">
<button type="button" class="btn btn-primary" id="add">Add</button>
<button type="button" class="btn btn-danger" id="delete">Remove Last Record</button>
<button style="float: right;" type="submit" class="btn btn-danger" id="print">Print Label(s)</button>
</div>
}
单击“添加”按钮后,将调用下面的脚本,并在 table 的 foreach
中添加一个 PartialView
。
var url = '@Url.Action("Add", "ProjectController")'; // adjust to suit
$('#add').click(function() {
$.get(url, function (response) {
$('<tr />').html(response).appendTo(tableBody);
});
});
下面是PartialView
:
@model Project.Models.SalesOrder
@using (Html.BeginCollectionItem("salesOrderTbl"))
{
<tr id="addRow" class="form-group">
@Html.HiddenFor(m => m.SalesOrderId)
<td>@Html.TextBoxFor(m => m.SalesOrderNumber, new {@class="form-control", @style="height: auto; width: 5em;"})</td>
<td>@Html.TextBoxFor(m => m.CustId, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.Location, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.DeliveryCompanyName, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.AddressL1, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.AddressL2, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.City, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.State, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.Zip, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.Reference1, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.Reference2, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
<td>@Html.TextBoxFor(m => m.Pieces, new { @class = "form-control", @style = "height: auto; width: 5em;" })</td>
</tr>
}
我要完成的下一步是使用“打印”按钮post将 SalesOrder
对象发送到我的 ProjectController
。
下面是我正在尝试 post 的 ProjectController
方法:
[HttpPost]
public ActionResult Print(List<SalesOrder> salesOrders)
{
//do things
}
不幸的是,这对我不起作用,salesOrder
列表对象始终为空。我相信我误解了如何使用 PartialView
所以如果有人能指出我哪里出错了,我将不胜感激。
您的部分使用 BeginCollectinItem()
添加名为 "salesOrderTbl"
的前缀,为了绑定,您的 POST 方法中的参数名称必须匹配。
[HttpPost]
public ActionResult Print(List<SalesOrder> salesOrderTbl)
或者,保留现有的方法参数名,将部分中的视图代码更改为
@using (Html.BeginCollectionItem("salesOrders"))
{
....
}
另请注意,您的部分正在创建一个 <tr>
元素,因此您不需要将其包含在用于动态添加新行的脚本中的另一个 <tr>
元素中。应该只是
var tableBody = $('#...'); // give your tbody an id
var url = '@Url.Action("Add", "ProjectController")'; // adjust to suit
$('#add').click(function() {
$.get(url, function (response) {
$(tableBody').append(response);
});
});