一部のデータを更新および削除するためのアクション リンクを含むテーブルがコードに含まれています。そして、このテーブルは、更新または削除を行うときに変更する必要がある div 内にあります。
問題は、これらのアクションリンクをクリックすると、いくつかの ajax 伝播が発生することです。クリックイベントを jquery メソッド stopPropagation にリンクする伝播を停止しようとしました。それは機能しますが、ページが読み込まれると、部分ビューの要素のみが読み込まれます。だから私は要素に順序がなく、レイアウトを使用しません。さらに、url は actionlink の ajax オプションで指定されたものに変更されます。停止伝播を使用しないと、うまく機能し、レイアウトを使用してすべての要素が適切に読み込まれますが、伝播は存在します (ページを使用するほど遅くなるので問題です)
ページを表示:
<div id="divToUpdate">
@using (Ajax.BeginForm("LanguageSkills", "Employee",
new AjaxOptions
{
OnFailure = "searchFailed",
HttpMethod = "POST",
UpdateTargetId = "divtoUpdate",
OnBegin = "validateForm",
}))
{
Html.RenderPartial("PartialViewButtons");
Html.RenderPartial("PartialViewLanguageSkillsForm", Model);
}
@if (ViewBag.Languages == 1)
{ Html.RenderPartial("PartialViewLanguageTable"); }
</div>
テーブルの部分ビュー:
<table id="LanguageTable">
<tr>
<th align="center">Language</th>
<th align="center">Skill 1</th>
<th align="center">Skill 2</th>
<th align="center">Skill 3</th>
<th align="center">Skill 4</th>
</tr>
@foreach (var item in (List<Project.Models.Language>)ViewBag.LanguageSkills)
{
<tr>
<td align="center">
@Html.DisplayFor(modelItem => item.Language.Language1)
</td>
<td align="center">@Html.DisplayFor(modelItem => item.Skill1)</td>
<td align="center">@Html.DisplayFor(modelItem => item.Skill2)</td>
<td align="center">@Html.DisplayFor(modelItem => item.Skill3)</td>
<td align="center">@Html.DisplayFor(modelItem => item.Skill4)</td>
</tr>
@Ajax.ActionLink("Modify", "ModifyLanguage", "Employee", new { id = item.LanguageId},
new AjaxOptions {
UpdateTargetId = "divtoUpdate",
OnBegin = "validateForm",
HttpMethod="GET"
}, new {@class = "ModifyLink"})
@Ajax.ActionLink("Delete", "DeleteLanguage", "Employee", new { id = item.LanguageId },
new AjaxOptions {
HttpMethod="POST",
}, new { @class = "DeleteLink" })
</td>
</tr>
}
</table>
最後に、部分ビューの JavaScript:
$($('.ModifyLink')).load(function (event) {
event.stopImmediatePropagation();
});