是否可以将一个 .net ASP MVC 控制器用于两个“面板”？

Question

我正在学习 asp mvc 模式，并且对控制器有点迷失。我正在构建的网页需要在左侧有一个搜索“面板”，在右侧有一个数据窗口。

这是一个或两个控制器的任务吗？我需要的是用户在搜索面板上输入数据，单击“开始”，然后在该面板中显示结果。

在一个控制器下，这一切似乎都很容易，但是......

我想单击搜索面板中的结果之一并在右侧面板中显示其数据，但这是否是新控制器的工作？看起来像是两个控制器直观地控制每个面板，但这可能吗？

Answer 1

您所描述的内容可以通过多种方式实现，但这听起来有点像您正在考虑像页面这样的“控制器”。控制器包含多个方法，每个方法都会执行一个操作（可能是页面渲染）。控制器并不代表网页，而是执行的操作的集合（重定向、GET、POSTS 等）。

我想单击搜索面板中的其中一个结果并在右侧面板中显示其数据，但这是否是新控制器的工作？看起来像是两个控制器直观地控制每个面板，但这可能吗？

1. 不，这可能不是新控制器的工作。
2. 是的，但可能不是你想要的。

您可能只有一个控制器，但有两种用于搜索的 Get 和 Post 阶段的方法。如何填充每个面板会带来很多问题：

• 您会在搜索时强制刷新页面吗？
• 阿贾克斯重载？
• 天哪，框架？
• JavaScript 面板？

也许最容易开始的是第一个选项 - 在搜索时强制刷新页面。

public class MyController : Controller
{
    // GET
    public ActionResult Index()
    {
        return View();
    }

    // POST
    [HttpPost]
    public ActionResult Index(string searchWord)
    {
        // Perform whatever steps involved in finding things
        IEnumerable<MyResults> results = _service.Search(searchWord);

        // Pass the result into the view
        return View(results);
    }
}

然后是快速简单的视图：

@model IEnumerable<MyResults>

<div id="panel_1">
@using(Html.BeginForm())
{
    <input type="text" name="searchWord" />
    <button type="submit">Go</button>
}
</div>

<div id="panel_2">
    @if(Model != null)
    {
        <ul>
            @foreach(var result in Model)
            {
                <li>@result.Name</li>
            }
        </ul>
    }
</div>

从这里开始，将其与 Ajax 连接起来相当简单。

编辑 - 第 2 步 - ajax 内容。

控制器操作不必返回整个视图 - 它们可以返回 ajax 请求的一部分。

因此，至少为面板 2 添加部分内容：

Index.cshtml：

@*
    Panel 1 remains the same.  Or could move it do it's own partial and
    render it via Html.RenderPartial("Panel1")
*@
<div id="panel_1">
    @using(Html.BeginForm())
    {
        <input type="text" name="searchWord" />
        <button type="submit">Go</button>
    }
</div>

@* This is now just a placeholder since it will be populated via ajax. *@
<div id="panel_2"></div>

创建一个新视图，Panel2.cshtml

@model IEnumerable<MyResults>

@if(Model != null)
{
    <ul>
        @foreach(var result in Model)
        {
            <li>@result.Name</li>
        }
    </ul>
}
else
{
    <i>Nothing found</i>
}

然后更改控制器操作：

// POST
[HttpPost]
public ActionResult Index(string searchWord)
{
    // Perform whatever steps involved in finding things
    IEnumerable<MyResults> results = _service.Search(searchWord);

     // Pass the result into the partial view for panel 2
     return View("Panel2", results);
}

唯一剩下的就是一些将它们链接在一起的 javascript（不能完全完成这一切）我的头顶）

$(document).ready(function() {
    $('#panel_1 form').submit(function() {
        $.post({
            url: this.action,
            success: function(response) {
                // Replace the contents in panel 2
                $('#panel_2).html(response);
            }
        });
    });
});

Answer 2

您的搜索面板和输出（结果）面板似乎都位于搜索“上下文”中。让同一个控制器处理这些是完全可以接受的。

当人们开始 MVC 时，他们得到了很多建议，为每个实体配备一个控制器。这是在 CRUD 上下文中学习 MVC 的好建议，但在移动传递的实体 CRUD 时可能会导致一些混乱。

根据您的情况选择 SearchController 。