コントローラーに 2 つのアクションがあります。
// GET: /Directory/
public ActionResult Index()
{
ViewModels.DirectoryIndex model = new ViewModels.DirectoryIndex();
return View(model);
}
// POST: /Directory/Filter/[viewModel]
[HttpPost]
public ActionResult Filter(ViewModels.DirectoryIndex viewModel)
{
int distance = 0;
string state = string.Empty;
if (viewModel.SelectedDistance > 0)
distance = viewModel.SelectedDistance;
else if (viewModel.SelectedState > 0)
state = viewModel.States.Where(a => a.Value == viewModel.SelectedState.ToString()).FirstOrDefault().Text;
// TODO: Add filter activities here...
return PartialView("IndexPartial", viewModel);
}
View と PartialView があります (注: Razor は使用していません!)
ビューは次のようになります。
<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<RainWorx.FrameWorx.MVC.ViewModels.DirectoryIndex>" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<div class="Column12">
<div class="Shadow"></div>
<h2 class="h2row"><%= Model.PageTitle %></h2>
<% using (Ajax.BeginForm("Filter", new AjaxOptions { UpdateTargetId = "filteredList" })) { %>
<div class="searchDirectory">
<label title="State">State: </label>
<%= Html.DropDownListFor(a => a.SelectedState, Model.States, "-- Select One --", new { @id = "ddlStates" })%>
-or-
<label title="ZipCode">Zip Code within: </label>
<%= Html.DropDownListFor(a => a.SelectedDistance, Model.Distance, "-- Select One --", new { @id = "ddlDistance" })%>
<input type="text" id="myZip" name="myZip" />
<input type="submit" value="Filter" />
</div>
<% } %>
<div id="filteredList" class="businessCard">
<% { Html.RenderPartial("IndexPartial", Model); } %>
</div>
<div style="height: 200px;"></div>
</div>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="head" runat="server">
<link type="text/css" href="Content/css/directory.css" rel="Stylesheet" />
<script src="Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript" />
<title><%= Model.PageTitle %></title>
</asp:Content>
PartialView は次のようになります。
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<RainWorx.FrameWorx.MVC.ViewModels.DirectoryIndex>" %>
<% foreach (var d in Model.Dealers) { %>
<div class="businessCard Outline">
<div class="businessCard Logo">
<img src="<%= Url.Content("~/Content/Images/Directory/logo01_150wide.png") %>" alt="Logo" />
</div>
<div class="businessCard Info">
<div class="businessCard Name"><%= d.Name %></div>
<div class="businessCard Address"><%= d.Address %></div>
<div class="businessCard City"><%= d.City %>, <%= d.State %> <%= d.ZipCode %></div>
<div class="businessCard Phone"><%= d.Phone %></div>
</div>
</div>
<% } %>
何らかの理由で、使用するフィルターを選択してフォームを送信すると、2 番目のアクションが正しく呼び出されます。ただし、PartialView は更新されず、代わりに PartailView がフル ビューとしてレンダリングされます。URL 用語:
- http://mysite.com/Directoryから始めます - フィルターを選択し、[送信] をクリックします。
- http://mysite.com/Directoryで終了すると予想しているときに、 http: //mysite.com/Directory/Filterで終了します。
明らかに単純なものが欠けています。私は以前にRazorでこれを行ったことがあります(ところで、この混乱よりもRazorが大好きです)、すべてそこで機能します。
注: これは私が拡張しているサード パーティ製品であるため、すべてを Razor に変換する余裕はありません。