在MVC/Razor中,如何获取多个复选框的值并将它们全部传递给控制器?
In MVC/Razor, how do I get the values of multiple checkboxes and pass them all to the controller?
我有一个视图,其中包含模型中的项目列表。我需要向每一行添加一个复选框,让用户 select 多个复选框,并将 selected 的行的一些标识符传递给控制器。我知道如何通过操作 link 传递单个值,但我不确定如何通过操作 link 传递多个值或如何 "collect" 哪些行是 [=37] =]编辑。我将在下面展示我的一些代码尝试。谁能帮我弄清楚为什么我无法获取传递给控制器的所有复选框的值?
这是我的页面
Checkbox App ID Date Name
[] 1 5/10 Bob
[] 2 5/10 Ted
[] 3 5/11 Alice
我需要用户做的是 select 第 1 行和第 3 行(例如)并将这些 App ID 传递给控制器。
我开始列出各种尝试,但决定只展示我目前的尝试,看看是否有人可以指出我做错了什么。我看到的在线示例和我的示例之间的主要区别是我使用 PagedList 并在 foreach 循环中创建 table 的行。
参数ints打到控制器上是空的。如何从复选框中获取值?我使用这个站点的基本思想是将所有复选框命名为相同并通过操作 link 传递 ICollection:
http://haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx/
查看:
@model PagedList.IPagedList<CarmelFinancialWeb.Models.ModelMerchantSummary>
<div class="block" style="width: 100%; float: left">
<p class="block-heading">
Merchant Application Report
</p>
<div class="table-holder">
<table class="table" style="margin-bottom: 0px">
<tbody>
@foreach (var item in Model)
{
<tr>
<td>
<input type="checkbox" name="ints" value=item.ApplicationID />
</td>
<td>
@Html.ActionLink(item.ApplicationID.ToString(), "ViewApplication", new { ID = item.ApplicationID, edit = 1 }, new AjaxOptions { HttpMethod = "GET" })
</td>
<td>
@Convert.ToDateTime(item.ApplicationDate).ToString("M/d/yy")
</td>
<td>
@item.ApplicantName
</td>
</tbody>
</table>
</div>
</div>
@Html.ActionLink("Print Application", "PrintApplication", "CreateContract", new { @class = "btn btn-primary" })
控制器:
[AuthorizeAdmin]
public ActionResult PrintApplication(ICollection<int> ints, string ID)
{
Contracts_Create contract = new Contracts_Create();
ModelApplication currentApplication = new ModelApplication();
currentApplication.contract = new ModelContract();
return File(contract.CreatePDF_PrintedApplication_English(currentApplication.contract.location, currentApplication.contract), "application/pdf");
}
编辑:
这被标记为另一个问题的副本。那里的问题是关于是否可以使用非顺序输入名称。我的问题是我使用的输入不是非连续的,但它仍然无法正常工作。我理解这个概念,只是想不通为什么我的特定代码不起作用。我花了很多时间来解决这个问题,但找不到我的特定代码的答案。谢谢!
不要在 mvc 中使用 foreach
,始终使用 for
和索引变量进行迭代。
您还需要一个布尔值来跟踪选择状态。
这个示例代码对我有用:
public class AModel
{
public List<AnotherModel> Items { get; set; }
}
public class AnotherModel
{
public int ApplicationId { get;set; }
public DateTime ApplicationDate { get; set; }
public string ApplicantName { get; set; }
public bool Selected { get; set; }
}
Page.cshtml
@using (Html.BeginForm("PostIndex", "Home", FormMethod.Post))
{
<table class="table" style="margin-bottom: 0px">
<tbody>
@for (var i = 0; i < Model.Items.Count(); i++)
{
<tr>
<td>
<label>@Html.CheckBoxFor(model => model.Items[i].Selected) @Html.DisplayFor(model => model.Items[i].ApplicantName)</label>
</td>
<td>
@Html.ActionLink(Model.Items[i].ApplicationId.ToString(), "ViewApplication", new {ID = Model.Items[i].ApplicationId, edit = 1}, new AjaxOptions {HttpMethod = "GET"})
</td>
<td>
@Html.DisplayFor(model => model.Items[i].ApplicationDate)
</td>
<td>
@Html.DisplayFor(model => model.Items[i].ApplicationId)
</td>
</tr>
}
</tbody>
</table>
<input type="submit"/>
}
尝试将 ViewModel 传递到您的页面,并使用模型绑定器将相同的视图模型post返回到您的控制器
型号:
public class MerchantModel
{
public int AppId { get; set; }
public string Name { get; set; }
public bool IsSelected { get; set; }
}
public class MerchantViewModel
{
public List<MerchantModel> Merchants { get; set; }
}
控制器:
public class DefaultController : Controller
{
// GET: Default
public ActionResult Index()
{
var merchant1 = new MerchantModel
{
AppId = 1,
Name = "Bob"
};
var merchant2 = new MerchantModel
{
AppId = 2,
Name = "Ted"
};
var merchant3 = new MerchantModel
{
AppId = 3,
Name = "Alice"
};
List<MerchantModel> list = new List<MerchantModel>();
list.Add(merchant1);
list.Add(merchant2);
list.Add(merchant3);
var model = new MerchantViewModel
{
Merchants = list
};
return View(model);
}
[HttpPost]
public ActionResult Index(MerchantViewModel model)
{
return View(model);
}
}
查看:
@model TestCheckBoxes.Models.MerchantViewModel
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<div>
<form action="/default/index" method="post">
<table>
@for (int i = 0; i < Model.Merchants.Count; i++)
{
<tr>
<td>
@Html.CheckBoxFor(x => x.Merchants[i].IsSelected)
</td>
<td>
@Html.HiddenFor(x => x.Merchants[i].AppId)
@Model.Merchants[i].AppId
</td>
<td>
@Html.HiddenFor(x => x.Merchants[i].Name)
@Model.Merchants[i].Name
</td>
</tr>
}
</table>
<button type="submit">Submit</button>
</form>
</div>
</body>
</html>
返回控制器中的 [HttpPost] 方法,您将得到一个 MerchantModel 的列表,其 bool 值为 true 或 false。这样你就可以检查它是否正确,然后从那里获取 AppId。
@CBauer 和@NickYoung 基本上找到了答案。关键是 (1) 确保我的复选框在 ID 中写有相同后缀的括号中的序列号,(2) 使用提交按钮而不是操作 link,以及 (3) 正确编写控制器接受复选框中的 ID。我想 post 我的一些代码可以让您了解我要做什么:
查看(部分):
@model PagedList.IPagedList<CarmelFinancialWeb.Models.ModelMerchantSummary>
...
@{var i = 0;}
@foreach (var item in Model)
{
var tmp = "[" + i + "].ints";
<tr>
<td>
<input name="ints" type="checkbox" id="@tmp" class="chkclass" value="@item.ApplicationID" />
</td>
...
<input id="Submit" type="submit" class="btn btn-primary" value="Print Application(s)" />
...
控制器:
[AuthorizeAdmin]
[HttpPost]
public ActionResult MerchantApplicationSummary(string[] ints, FormCollection form, int? page)
{
...
感谢@CBauer 和@NickYoung 的帮助!
我有一个视图,其中包含模型中的项目列表。我需要向每一行添加一个复选框,让用户 select 多个复选框,并将 selected 的行的一些标识符传递给控制器。我知道如何通过操作 link 传递单个值,但我不确定如何通过操作 link 传递多个值或如何 "collect" 哪些行是 [=37] =]编辑。我将在下面展示我的一些代码尝试。谁能帮我弄清楚为什么我无法获取传递给控制器的所有复选框的值?
这是我的页面
Checkbox App ID Date Name
[] 1 5/10 Bob
[] 2 5/10 Ted
[] 3 5/11 Alice
我需要用户做的是 select 第 1 行和第 3 行(例如)并将这些 App ID 传递给控制器。
我开始列出各种尝试,但决定只展示我目前的尝试,看看是否有人可以指出我做错了什么。我看到的在线示例和我的示例之间的主要区别是我使用 PagedList 并在 foreach 循环中创建 table 的行。
参数ints打到控制器上是空的。如何从复选框中获取值?我使用这个站点的基本思想是将所有复选框命名为相同并通过操作 link 传递 ICollection: http://haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx/
查看:
@model PagedList.IPagedList<CarmelFinancialWeb.Models.ModelMerchantSummary>
<div class="block" style="width: 100%; float: left">
<p class="block-heading">
Merchant Application Report
</p>
<div class="table-holder">
<table class="table" style="margin-bottom: 0px">
<tbody>
@foreach (var item in Model)
{
<tr>
<td>
<input type="checkbox" name="ints" value=item.ApplicationID />
</td>
<td>
@Html.ActionLink(item.ApplicationID.ToString(), "ViewApplication", new { ID = item.ApplicationID, edit = 1 }, new AjaxOptions { HttpMethod = "GET" })
</td>
<td>
@Convert.ToDateTime(item.ApplicationDate).ToString("M/d/yy")
</td>
<td>
@item.ApplicantName
</td>
</tbody>
</table>
</div>
</div>
@Html.ActionLink("Print Application", "PrintApplication", "CreateContract", new { @class = "btn btn-primary" })
控制器:
[AuthorizeAdmin]
public ActionResult PrintApplication(ICollection<int> ints, string ID)
{
Contracts_Create contract = new Contracts_Create();
ModelApplication currentApplication = new ModelApplication();
currentApplication.contract = new ModelContract();
return File(contract.CreatePDF_PrintedApplication_English(currentApplication.contract.location, currentApplication.contract), "application/pdf");
}
编辑: 这被标记为另一个问题的副本。那里的问题是关于是否可以使用非顺序输入名称。我的问题是我使用的输入不是非连续的,但它仍然无法正常工作。我理解这个概念,只是想不通为什么我的特定代码不起作用。我花了很多时间来解决这个问题,但找不到我的特定代码的答案。谢谢!
不要在 mvc 中使用 foreach
,始终使用 for
和索引变量进行迭代。
您还需要一个布尔值来跟踪选择状态。
这个示例代码对我有用:
public class AModel
{
public List<AnotherModel> Items { get; set; }
}
public class AnotherModel
{
public int ApplicationId { get;set; }
public DateTime ApplicationDate { get; set; }
public string ApplicantName { get; set; }
public bool Selected { get; set; }
}
Page.cshtml
@using (Html.BeginForm("PostIndex", "Home", FormMethod.Post))
{
<table class="table" style="margin-bottom: 0px">
<tbody>
@for (var i = 0; i < Model.Items.Count(); i++)
{
<tr>
<td>
<label>@Html.CheckBoxFor(model => model.Items[i].Selected) @Html.DisplayFor(model => model.Items[i].ApplicantName)</label>
</td>
<td>
@Html.ActionLink(Model.Items[i].ApplicationId.ToString(), "ViewApplication", new {ID = Model.Items[i].ApplicationId, edit = 1}, new AjaxOptions {HttpMethod = "GET"})
</td>
<td>
@Html.DisplayFor(model => model.Items[i].ApplicationDate)
</td>
<td>
@Html.DisplayFor(model => model.Items[i].ApplicationId)
</td>
</tr>
}
</tbody>
</table>
<input type="submit"/>
}
尝试将 ViewModel 传递到您的页面,并使用模型绑定器将相同的视图模型post返回到您的控制器
型号:
public class MerchantModel
{
public int AppId { get; set; }
public string Name { get; set; }
public bool IsSelected { get; set; }
}
public class MerchantViewModel
{
public List<MerchantModel> Merchants { get; set; }
}
控制器:
public class DefaultController : Controller
{
// GET: Default
public ActionResult Index()
{
var merchant1 = new MerchantModel
{
AppId = 1,
Name = "Bob"
};
var merchant2 = new MerchantModel
{
AppId = 2,
Name = "Ted"
};
var merchant3 = new MerchantModel
{
AppId = 3,
Name = "Alice"
};
List<MerchantModel> list = new List<MerchantModel>();
list.Add(merchant1);
list.Add(merchant2);
list.Add(merchant3);
var model = new MerchantViewModel
{
Merchants = list
};
return View(model);
}
[HttpPost]
public ActionResult Index(MerchantViewModel model)
{
return View(model);
}
}
查看:
@model TestCheckBoxes.Models.MerchantViewModel
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<div>
<form action="/default/index" method="post">
<table>
@for (int i = 0; i < Model.Merchants.Count; i++)
{
<tr>
<td>
@Html.CheckBoxFor(x => x.Merchants[i].IsSelected)
</td>
<td>
@Html.HiddenFor(x => x.Merchants[i].AppId)
@Model.Merchants[i].AppId
</td>
<td>
@Html.HiddenFor(x => x.Merchants[i].Name)
@Model.Merchants[i].Name
</td>
</tr>
}
</table>
<button type="submit">Submit</button>
</form>
</div>
</body>
</html>
返回控制器中的 [HttpPost] 方法,您将得到一个 MerchantModel 的列表,其 bool 值为 true 或 false。这样你就可以检查它是否正确,然后从那里获取 AppId。
@CBauer 和@NickYoung 基本上找到了答案。关键是 (1) 确保我的复选框在 ID 中写有相同后缀的括号中的序列号,(2) 使用提交按钮而不是操作 link,以及 (3) 正确编写控制器接受复选框中的 ID。我想 post 我的一些代码可以让您了解我要做什么:
查看(部分):
@model PagedList.IPagedList<CarmelFinancialWeb.Models.ModelMerchantSummary>
...
@{var i = 0;}
@foreach (var item in Model)
{
var tmp = "[" + i + "].ints";
<tr>
<td>
<input name="ints" type="checkbox" id="@tmp" class="chkclass" value="@item.ApplicationID" />
</td>
...
<input id="Submit" type="submit" class="btn btn-primary" value="Print Application(s)" />
...
控制器:
[AuthorizeAdmin]
[HttpPost]
public ActionResult MerchantApplicationSummary(string[] ints, FormCollection form, int? page)
{
...
感谢@CBauer 和@NickYoung 的帮助!