如何在ASP.NET MVC中将信息从弹出窗口/模式窗口传递到基本窗口

Question

我正在用ASP.NET MVC编写一个联系人表单。用户将具有附加常规文件的能力(使用常规文件/浏览功能)以及搜索特定人员并附加与该人员相关的文件的能力。第一部分很简单，但第二部分让我头疼。

对于第二部分，我将使用2-3页向导。用户将看到一个搜索字段，输入用户名，点击搜索，并显示结果列表。单击名称后，他们将看到相关记录的列表，他们可以检查其中的一些记录，也可以不检查任何记录。然后用户将单击attach，文件将显示在contact表单中。

我担心如果我离开联系人页面或绕过模式窗口中的控制器(模式窗口可以在页面之间导航吗？)或者弹出窗口，我会以某种方式搞乱整个MVC架构。

我不想胡乱处理AJAX调用，那么我该如何弹出一个窗口，运行这个快速的2-3页搜索向导，然后将内容写回基本窗口呢？这只是一个基本的JavaScript和超文本标记语言的问题，或者您认为这将涉及更多，还是AJAX只是一个必然性？

Answer 1

通过jQuery呈现PartialViews是一种只更新部分视图的有效方法。

不深入jQuery以及如何使用它，让我们开始吧。

在视图PartialView或MasterPage中，链接到jQuery脚本文件。

<script src="../../Scripts/ jquery-1.3.2.min.js"></script>

首先，我们将创建一个jQuery函数将调用的ActionResult。它与任何其他ActionResult完全相同，只是它不会返回视图，而是返回PartialView。

public ActionResult getFilteredData(string filter)
{
  //do something interesting with filter like
  //returning a list of items from a db

  //once we have our data we can return
  //a partial view giving to it the data as its model
  return PartialView("MyPartialView", returnedDataList);
}

对于ActionResult来说，差不多就是这样了。

正如我希望您看到的，该方法只是接受一个参数，将数据过滤成一个列表，然后返回一个以数据列表作为其定义模型的PartialView。

Html看起来像这样；

<div id="myPartialView">
</div>

请注意，我将div命名为与部分视图相同的名称。这两者没有任何关系，我只是认为它让事情变得简单易懂。

现在到jQuery了。

$.post("/MyController/getFilteredData", { filter: “dogs” },  
  function(newHTML) { 
document.getElementById("myPartialView").innerHTML = newHTML;
});

所以jQuery所做的就是发回动作，传入一个“狗”的过滤器。在newHTML中捕获来自ActionResult的响应，然后将其放在名为myPartialView的div中。

Answer 2

为什么Ajax会成为这样一个问题？如果您使用Ajax，那么您可以回发详细信息，返回一个完全呈现的PartialView并将其显示在页面上。

这样，您就不会离开您的基页，一切都会很好，并且您可以将所有数据回发到您的基页控制器。

所以简单地说一下。向导中的每个步骤都可以是局部视图，并且随着这些步骤的进展，您可以在相同的位置呈现局部视图。

另一种选择是，所有三个步骤都在基础页面上开始，您可以根据需要显示/隐藏tham。

另外，不要忘记REST原则。如果您希望您的向导是单独的视图，那么每个视图都需要对自己负责。当然，您可以使用id调用控制器，也可以传递完整的模型。

通过这种方式，视图可以加载模型、呈现自身、更新模型属性并将模型传递到下一个视图。

只有几个想法。我想是由你来选择最好的口味。

我会选择我的最后一个选择。我认为将视图模型传递给每个控制器会得到最好的结果。

我希望这能帮到你。