4

一部のデータを更新および削除するためのアクション リンクを含むテーブルがコードに含まれています。そして、このテーブルは、更新または削除を行うときに変更する必要がある 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();
    });
4

0 に答える 0