1

フォームに ajax を追加したい。主なビューは次のとおりです。

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>

// here I display each post from Posts collection
@foreach (var post in Model.Posts)
{   
<div>
<div>
    <strong>
        Title: @post.Title
    </strong>
</div>
<div>@post.Text</div>
<div>Posted by: @post.User.UserName</div>
<div>Posted Date: @post.CreatedDate</div>

@{ var membershipUser = Membership.GetUser(); }
@if (membershipUser != null)
{
    var providerUserKey = membershipUser.ProviderUserKey;
    if (providerUserKey != null && post.CreatedBy == (Guid) providerUserKey)
    {
        <div style="display: none; color: red;" id="postEditLoading">Loading..</div>

        <p id="postEdit">

            // EditPost method returns edit view asynchronously

            @Ajax.ActionLink("Edit", "EditPost", new {id = post.PostId, @class = "averageLink"},
                new AjaxOptions {UpdateTargetId = "postEdit", LoadingElementId = "postEditLoading", LoadingElementDuration = 3000})

            @Html.ActionLink("Delete", "DeletePost", new {id = post.PostId}, new {@class = "averageLink"})
        </p>
    }
}

この奇妙なことを除いて、すべてが機能します: EditPost メソッドによって返されるフォームは、最初の投稿を編集するか最後の投稿を編集するかに関係なく、最初の投稿のすぐ下に表示されます。

編集したい投稿の下にフォームが表示されるようにするには、どうすればこれを修正できますか??

事前に助けてくれてありがとう！

4

2 に答える 2

1

これは、ActionLink で使用した updatetargetid が原因だと思います。更新された要素の ID は「postEdit」ですが、アイテムごとに同じ ID で ap を作成します。各アイテムに基づいて p の id を変更し、そのアイテムに基づいて updatetargetid も変更する必要があると思います。

このようなもの：

@{string UpdatepID = "postEdit" + post.PostId;}
<p id=@UpdatepID>

            // EditPost method returns edit view asynchronously

            @Ajax.ActionLink("Edit", "EditPost", new {id = post.PostId, @class = "averageLink"},
                new AjaxOptions {UpdateTargetId = UpdatepID, LoadingElementId = "postEditLoading", LoadingElementDuration = 3000})
于 2013-01-24T19:32:45.217 に答える
0

投稿ごとにこの 2 つのタグがありますね。 

    <div id="postEditLoading">Loading..</div>

    <p id="postEdit">
    </p>

この場合、同じ ID を持つ複数のタグがあり、実際には html に違反しています。その場合、js は到達可能な最初のタグを取得します。

これを修正するには、投稿情報に基づいてタグに名前を付けることができます。

    <div id="postEditLoading-@post.PostId">Loading..</div>

    <p id="postEdit-@post.PostId">
    </p>
于 2013-01-24T19:30:14.773 に答える