То, что вы описываете, может быть достигнуто множеством способов, но звучит так, будто вы думаете о «контроллере», как страница. Контроллер содержит несколько методов, каждый из которых будет выполнять действие (возможно, это может быть рендеринг страницы). Контроллер представляет не веб-страницу, а набор выполненных действий (перенаправления, GET, POSTS и т. Д.).
Я хочу щелкнуть по одному из результатов на панели поиска и отобразить их данные на правой панели, но это работа для нового контроллера? Кажется, что два контроллера интуитивно управляют каждой панелью, но возможно ли это?
- Нет, это, вероятно, не работа нового контроллера.
- Да, но, вероятно, не то, что вы хотите.
Скорее всего, у вас будет только один контроллер, но два метода для фазы поиска 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);
}
});
});
});