mvc 在一个页面中使用多个表单，通过选择单选按钮进行筛选
本文关键字：表单 选择 单选按钮 筛选 一个 mvc | 更新日期: 2023-09-27 18:36:50
我有一个包含 3 个表单的页面，每个表单都根据上一个表单中单选按钮的选定值显示（我使用 viewbag 来控制可见性希望找到更好的东西），并且所有表单都使用相同的视图模型。是否可以将 3 个表单发布到同一操作并使 ViewModel 保存所有要发送到另一个页面甚至存储在数据库中的选定值？我试图这样做，在每篇帖子之后，旧的选定值在 ViewModel 中变为空。我也尝试了此处发布的解决方案，但仍然无法将所有选定值保存在 ViewModel 中，那么存储所选值以供以后使用的最佳方法是什么？
路由列表.cs我的视图模型
public class RoutesList
{
public int ID { get; set; }
public List<Route> Routes
{
get
{
Queries.BookingHandler handler = new Queries.BookingHandler();
return handler.GetAllRoutes();
}
set { }
}
public List<Route> OppositeRoutes
{
get
{
Queries.BookingHandler handler = new Queries.BookingHandler();
return handler.GetRoutDirections(long.Parse(SelectedRouteID));
}
set { }
}
public List<RouteStation> RouteStations
{
get
{
Queries.BookingHandler handler = new Queries.BookingHandler();
return handler.GetRouteStations(long.Parse(SelectedOppositeRouteID));
}
set { }
}
public string SelectedRouteID { get; set; }
public string SelectedOppositeRouteID { get; set; }
public string SelectedFromStationID { get; set; }
public string SelectedToStationID { get; set; }
public int Count { get; set; }
}
我的控制器对获取和发布都有索引操作
public ActionResult Index()
{
return View(new RoutesList());
}
[HttpPost]
public ActionResult Index(RoutesList route, FormCollection frm)
{
if (!string.IsNullOrEmpty(route.SelectedRouteID))
ViewBag.isDirection = true;
if (!string.IsNullOrEmpty(route.SelectedOppositeRouteID))
ViewBag.isStations = true;
if(!string.IsNullOrEmpty(route.SelectedFromStationID)&&!string.IsNullOrEmpty(route.SelectedToStationID))
return RedirectToAction("Index", "Time", new { id = route.SelectedRouteID });
return View(route);
}
和我的视图索引.cshtml
@model BusStarBackend.Models.RoutesList
@using (Html.BeginForm())
{
<table class="table table-hover">
<tr>
<th>Trips</th>
<th>Price</th>
</tr>
@foreach (var item in Model.Routes)
{
<tr>
<td>
@Html.RadioButtonFor(m => m.SelectedRouteID, item.RouteID)
@Html.DisplayFor(model => item.RouteName)
</td>
<td>@Html.DisplayFor(m => item.TicketPrice)</td>
<td> </td>
</tr>
}
</table>
<input type="submit" value="next" class="btn btn-default" />
}
@{
using (Html.BeginForm())
{
if (ViewBag.isDirection != null && ViewBag.isDirection)
{
<table class="table">
<tr>
<th>
Please selected your Direction
</th>
<th></th>
</tr>
@foreach (var item in Model.OppositeRoutes)
{
<tr>
<td>
@Html.RadioButtonFor(m => Model.SelectedOppositeRouteID, item.RouteID)
@Html.DisplayFor(modelItem => item.RouteName)
</td>
</tr>
}
</table>
<input type="submit" value="next" class="btn btn-default" />
}
}
}
@{
if (ViewBag.isStations != null && ViewBag.isStations)
{
using (Html.BeginForm())
{
<div id="stations">
<table class="table">
<tr>
<th>
From Station
</th>
<th>
To Station
</th>
<th></th>
</tr>
@foreach (var item in Model.RouteStations)
{
<tr>
<td>
@Html.RadioButtonFor(model => model.SelectedFromStationID, item.StationID)
@Html.DisplayFor(modelItem => item.Station.Name)
</td>
<td>
@Html.RadioButtonFor(model => model.SelectedToStationID, item.StationID)
@Html.DisplayFor(modelItem => item.Station.Name)
</td>
</tr>
}
</table>
<input type="submit" value="next" class="btn btn-default" />
</div>
}
}
}
对于"最简单的"修复，您应该在开始表单之前使用"if's"，如下所示：
@model BusStar.Models.RoutesList
@if (ViewBag.isDirection != null && ViewBag.isDirection)
{...
@using (Html.BeginForm())
{.....
为了获得更好的解决方案，您应该使用"Html.Action"方法，构建包含每个表单的部分视图，并根据单选按钮的值仅呈现所需的表单。
像这样：
每个表单有 2 个分部视图 - 这是针对方向表单的：（称为 _directionForm.cshtml）
@model BusStar.Models.RoutesList
<table class="table">
<tr>
<th>
Please selected your Direction
</th>
<th></th>
</tr>
@foreach (var item in Model.OppositeRoutes)
{
<tr>
<td>
@Html.RadioButtonFor(m => Model.SelectedOppositeRouteID, item.RouteID)
@Html.DisplayFor(modelItem => item.RouteName)
</td>
</tr>
}
</table>
<input type="submit" value="next" class="btn btn-default" />
您的控制器：
public ActionResult Index()
{
return View(new RoutesList());
}
public ActionResult PartialForm(RoutesList route)
{
if (!string.IsNullOrEmpty(route.SelectedRouteID))
return view("__directionForm", route);
return view("...", route); //your other view
}
[HttpPost]
public ActionResult Index(RoutesList route, FormCollection frm)
{
//if (!string.IsNullOrEmpty(route.SelectedRouteID)) ViewBag.isDirection = true;
//if (!string.IsNullOrEmpty(route.SelectedOppositeRouteID)) ViewBag.isStations = true;
if(!string.IsNullOrEmpty(route.SelectedFromStationID)&&!string.IsNullOrEmpty(route.SelectedToStationID))
return RedirectToAction("Index", "Time", new { id = route.SelectedRouteID });
return View(route);
}
在您的旧视图中，将两种形式替换为：
Html.Action("PartialForm", Model)