在 MVC/Razor 中，如何打开一个新视图而不是局部视图？

Question

我有一个使用 Razor 的 MVC 项目。页面上有一个局部视图的视图。我在部分视图中有一个按钮可以更新部分视图。这很好用。但是，我在视图中有另一个按钮，我想打开一个新视图；到 "break out" 的原始视图。相反，这个新视图会在部分页面应该打开的位置打开。我如何"break out"的父视图打开一个新视图？

这是我之前的问题：

这是详细信息。我有一个局部视图的视图。单击 ButtonB 从数据库中获取一些数据；那里一切正常。

-------------------------------------------------
|                                               |
| MerchantApplicationSummary.cshtml             |
|                                               |
|                                               |
|    PartialDiv                                 |
|    -----------------------------------        |
|    | ApplicationReportPartial.cshtml |        |
|    |                                 |        |
|    |  [Button B]                     |        |
|    -----------------------------------        |
|                                               |
|    [Button A]                                 |
-------------------------------------------------

当我点击按钮 A 时，我想打开一个全新的视图：

-------------------------------------------------
|                                               |
| PrintApplication.cshtml                       |
|                                               |
|                                               |
-------------------------------------------------

相反，我在部分视图所在的位置打开了视图：

-------------------------------------------------
|                                               |
| MerchantApplicationSummary.cshtml             |
|                                               |
|                                               |
|    PartialDiv                                 |
|    -----------------------------------        |
|    | PrintApplication.cshtml         |        |
|    |                                 |        |
|    -----------------------------------        |
|                                               |
|    [Button A]                                 |
|                                               |
-------------------------------------------------

我认为这种行为来自于将 UpdateTargetId 设置为在原始页面上的 div 内输出部分页面。我需要这个，以便 ApplicationReportPartial 在正确的位置打开。

MerchantApplicationSummary.cshtml

@using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "PartialDiv" }))
{
   ...
   <div id="PartialDiv">
   @{
      Html.RenderPartial("ApplicationReportPartial");
    }
  </div>
  ...
}

这是检查它是来自按钮 A 还是按钮 B 的控制器：

AdminController.cs

    [AuthorizeAdmin]
    [HttpPost]
    public ActionResult MerchantApplicationSummary(string[] ints, FormCollection form, int? page, string submit)
    {
      if (ints != null && (submit == "Print Spanish Application(s)" || submit == "Print Application(s)"))
      {
        return View(@"~/Views/Admin/PrintApplication.cshtml");
      }
    else
    {
      ...
     return PartialView("ApplicationReportPartial", obj_MrntApp);
    }

如何保留它以便 ApplicationReportPartial 在 MerchantApplicationSummary 中打开，但 PrintApplication 在新视图中打开？

编辑：

这是按钮 A 的代码：

<input id="Submit" name="submit" type="submit" class="btn btn-primary" value="Print Application(s)" />

我确实有按钮 A 作为一个动作 link，但我需要它来使它成为一个提交按钮来传递某些值。又是这个动作：

public ActionResult MerchantApplicationSummary(string[] ints, FormCollection form, int? page, string submit)

当我点击按钮 A 时，我需要整数值； ints 是页面上选中的复选框的 ID 数组。如果我使用操作 link，我将如何将这些值传递给操作？ -- 我做了一些研究，看起来这是不可能的（参见 http://forums.asp.net/t/1470988.aspx?HTML+ActionLink+to+post）所以这让我回到了我最初的问题，即如何 "break out" 父视图。

Answer 1

执行标准表单提交并return重定向响应。

MerchantApplicationSummary.cshtml

@(Html.BeginForm("PrintApplication", "Admin", FormMethod.Post)) {
    ...
    <button type="submit" id="buttonA">Print</button>
}

你的控制器将是

[HttpPost]
public ActionResult PrintApplication(FormCollection form)
{
    // do stuff with form
    ...
    // stash data you need in redirected view
    TempData["PrintApplication.Id"] = id;

    return RedirectToAction("PrintApplication");
}

[HttpGet]
public ActionResult PrintApplication()
{
    int? id = TempData["PrintApplication.Id"] as int?;
    ViewBag.Id = id.Value;
    return View("PrintApplication");
}

您将表单和 RedirectToAction returns 302 Found 提交到浏览器，它将重定向到 GET PrintApplication 操作。

如果您需要与您的 MerchantApplicationSummary AJAX post 共享表格，这里比较麻烦。删除 AjaxHelper.

可能是最简单的

<div id="appForms">
 @(Html.BeginForm("PrintApplication", "ControllerName",
                  FormMethod.Post), new { id = "formId" }) {

    <div id="PartialDiv">
        @{ Html.RenderPartial("ApplicationReportPartial"); }
    </div>
    ...
    <button type="submit" id="buttonA">Print</button>
 }
</div>

然后连接按钮 B 以触发 jquery AJAX post。确保按钮 B 不是提交按钮（例如 <input type="submit"> 或 <button type="submit">）。

$("#appForms").on("click", "#buttonB", function(event) {
    var data = $("#formId").serialize();
    $.ajax({
        url: "/Admin/MerchantApplicationSummary",
        method: "POST",
        data: data,
        success: function(partialViewResult) {
            $("#PartialDiv").html(partialViewResult);
        }
    });
});

然后从 MerchantApplicationSummary.

中删除所有 PrintApplication 逻辑

我对你的细节了解不够，所以你可能需要在这里做一些调整。

Answer 2

我通过执行以下操作解决了问题： - 在父视图中，我使用 BeginForm 而不是 Ajax.BeginForm 并停止了 UpdateTargetId 分配。 - 在控制器中，返回局部视图的视图而不是局部视图。

MerchantApplicationSummary.cshtml

@using (Html.BeginForm("MerchantApplicationSummary", "Admin"))
{
 ...
 <div id="PartialDiv">
   @{
      Html.RenderPartial("ApplicationReportPartial");
    }
 </div>
 ...
 <input id="Submit" name="submit" type="submit" class="btn btn-primary" value="Print Application(s)" />
}

AdminController.cs

[AuthorizeAdmin]
[HttpPost]
public ActionResult MerchantApplicationSummary(string[] ints, FormCollection form, int? page, string submit, string PrintApplications)
{
  if (ints != null && (submit == "Print Spanish Application(s)" || submit == "Print Application(s)"))
  {
    ...
    return View(@"~/Views/Admin/PrintApplication.cshtml");
  }
  else
  {
    ...
    return View(obj_MrntApp);
  }
}

在 MVC/Razor 中，如何打开一个新视图而不是局部视图？

In MVC/Razor, how can you open a new view instead of as a partial view?

asp.net-mvc

partial-views

asp.net-mvc-partialview

razor

asp.net-mvc-4