mvc在一页中使用多个表单，并通过选择单选按钮进行过滤

Question

我有一个包含 3 个表单的页面，每个表单的显示取决于前一个表单中单选按钮的选定值（我使用 viewbag 来控制可见性，希望找到更好的东西）并且所有表单都使用相同的视图模型。是否可以将 3 个表单发布到同一个操作并让 ViewModel 保存所有选定的值以发送到另一个页面甚至存储在数据库中？我尝试在每次发布后将旧的选定值在 ViewModel 中变为空。 我还尝试了发布here 的解决方案，但仍然无法将所有选定的值保存在 ViewModel 中，那么存储选定值以供以后使用的最佳方法是什么？

RouteList.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; }
}

我的控制器对 Get 和 post 都有一个 index 操作

 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);

    }

还有我的 View Index.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>
        }
    }
}

Answer 1

对于“最简单”的修复，您应该在开始表单之前使用“if”，如下所示：

@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)