私はWebフォームのバックグラウンドを持っていますが、この時点でMVC4にかなり不満を感じています。私は例を見たり、ビデオを見たり、グーグルしたりしています。何も機能していないようで、タオルを投げようとしていますが、このサイトは非常に役立つので、これについて何か助けが得られるかどうかを確認します。
私がしたいのは：
- jQueryタブ（easytabs）を使用してページを作成します（これはところで行われます）
- タブクリックイベントで、ajaxを介してタブを再ロードしたいのですが
Webフォームでは、これで午前8時に完了します。私は今これとその午後5時に立ち往生しています。信じられないほどイライラした。
私はMVC4サイトのWebビデオチュートリアルに従いました。この素敵な例はRazorにあり、使用したくありませんが、知識のためにとにかくそれに従います。
http://www.asp.net/mvc/overview/javascript->'Javascript
とAjax'-
> http://pluralsight.com/training/players/PSODPlayer?author=scott-allen&name=mvc3-building-ajax&mode= live＆clip = 0＆course = aspdotnet-mvc3-intro
イージータブのHTMLでは、htmlを次のように定義します。
<li class="tab"><a href="#tabs-users" class="light heavy">Manage Sections</a></li>
そこで、ビデオに続いて、このHTMLを置き換えるために、ajaxヘルパーを介してajax属性を使用してタグを作成してアンカーしようとしました。
<% Ajax.ActionLink("Manage Sections", "tabsUsers", new AjaxOptions { HttpMethod = "GET", UpdateTargetId = "tabs-users", InsertionMode = InsertionMode.Replace }); %>
これは何もレンダリングしません。ページには表示されません。だから、私は狩りに行きます、そして私は以下が必要であることがわかります：
<%: Scripts.Render("~/bundles/jqueryval") %>
このバンドルには「jquery.unobtrusive-ajax.min.js」が含まれており、web.configにも次の設定があります。
<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />
まだ何もありません。
元のHTML
<div id="tab-container" class="tab-container">
<ul class="etabs">
<li class="tab upper first"><a href="#tabs-users" class="light heavy">Manage Users</a></li>
<li class="tab upper"><a href="#tabs-groups" class="light heavy">Manage Sections</a></li>
</ul>
<div id="tabs-users" class="normal light clearfix">
Users
</div>
<div id="tabs-groups" class="normal light clearfix">
Groups
</div>
</div>
Ajax.ActionLinkはそこにアンカータグをレンダリングするのが好きではないと感じていますが、理由はわかりません。
コントローラ
[HttpGet]
public PartialViewResult tabsUsers()
{
IEnumerable<SelectListItem> items = UserManager.GetUsers()
.Select(c => new SelectListItem
{
Value = c.UserID.ToString(),
Text = c.FirstName + c.LastName
});
return PartialView("UsersPartial", items);
}
UsersPartial View
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<IEnumerable<LMS.Data.User>>" %>
<table>
<tr>
<th>
<%: Html.DisplayNameFor(model => model.UserName) %>
</th>
<th>
<%: Html.DisplayNameFor(model => model.FirstName) %>
</th>
<th>
<%: Html.DisplayNameFor(model => model.LastName) %>
</th>
<th>
<%: Html.DisplayNameFor(model => model.Password) %>
</th>
<th>
<%: Html.DisplayNameFor(model => model.Email) %>
</th>
<th></th>
</tr>
<% foreach (var item in Model) { %>
<tr>
<td>
<%: Html.DisplayFor(modelItem => item.UserName) %>
</td>
<td>
<%: Html.DisplayFor(modelItem => item.FirstName) %>
</td>
<td>
<%: Html.DisplayFor(modelItem => item.LastName) %>
</td>
<td>
<%: Html.DisplayFor(modelItem => item.Password) %>
</td>
<td>
<%: Html.DisplayFor(modelItem => item.Email) %>
</td>
<td>
<%: Html.ActionLink("Edit", "Edit", new { id=item.UserID }) %> |
<%: Html.ActionLink("Details", "Details", new { id=item.UserID }) %> |
<%: Html.ActionLink("Delete", "Delete", new { id=item.UserID }) %>
</td>
</tr>
<% } %>
</table>
実行時にレンダリングされるスクリプトセクション
<script src="/Scripts/jquery-1.6.2.js" type="text/javascript"></script>
<script src="/Scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script>
<script src="/Scripts/jquery.validate.js" type="text/javascript"></script>
<script src="/Scripts/jquery.validate.unobtrusive.js" type="text/javascript"></script>
<script src="/Scripts/jquery-ui-1.8.11.js" type="text/javascript"></script>
<script src="/Scripts/jquery.easytabs.min.js" type="text/javascript"></script>
<script src="/Scripts/script.js" type="text/javascript"></script>
何か案は？？ここでMVCに価値のあるショットを提供したいのですが、それは私にとってあまり良いことではありません。