MVC 5 Ajax.BeginフォームがUpdateTargetIdを置き換えません

Question

私はウェブサイトで働いていますが、投稿にコメントを追加したい、すべてがHtml.Beginフォームで動作していますが、コメントを追加するたびにページがリフレッシュされます。

私はHtml.BeginFormをAjax.BeginFormに置き換えましたが、コメントを見るためにページをリフレッシュするために使用しました。 jquery.unobtrusive-ajax.jsを追加しましたが、まだ動作していません。

コントローラー：

public PartialViewResult Comments(string id) 
    { 
     return PartialView("Comments", _dc.Comments.Where(m => m.Id_P == id).OrderByDescending(m => m.Date).ToList()); 
    } 

    public ActionResult AddComment(string id, string comment) 
    { 
     Comment com = new Comment(); 
     com.Id = Guid.NewGuid().ToString(); 
     com.Id_A = AccountInfo.Id; 
     com.CommentT = comment; 
     com.Id_P = id; 
     com.Date = String.Format("{0: dd MMM 'at' HH:mm}", DateTime.Now); 

     _dc.Comments.Add(com); 
     _dc.SaveChanges(); 

     return RedirectToAction("Index", "Home"); 
    } 

ビュー：

<div class="article-comments"> 
    <div class="post-comm"> 
     @Html.Action("Comments", "Post", new { id = item.Id }) 
      @using (Ajax.BeginForm("AddComment", "Post", new AjaxOptions { HttpMethod = "POST", UpdateTargetId = "post-comm" })) 
      { 
       <input type="hidden" id="id" value="@item.Id" name="id" /> 
       <div class="form-group"> 
        <div class="col-md-12"> 
         <input class="form-control" placeholder="enter your comment..." name="comment" id="comment"> 
        </div> 
       </div> 
      } 
    </div> 
</div> 

私は、ビューを、これを試してみましたが、今のページに

public JsonResult AddComment(string id, string comment) 
    { 
     Comment com = new Comment(); 
     com.Id = Guid.NewGuid().ToString(); 
     com.Id_A = AccountInfo.Id; 
     com.CommentT = comment; 
     com.Id_P = id; 
     com.Date = String.Format("{0: dd MMM 'at' HH:mm}", DateTime.Now); 

     _dc.Comments.Add(com); 
     _dc.SaveChanges(); 

     return Json("success"); 
    } 

をリフレッシュされます。

<div class="post-comm"> 
    @Html.Action("Comments", "Post", new { id = item.Id }) 
</div> 
<form method="post" onsubmit="addComment('@item.Id', this)"> 
    <div class="form-group"> 
     <div class="col-md-12"> 
       <input class="form-control" placeholder="enter your comment..." name="comment" id="comment"> 
      </div> 
    </div> 
</form> 

とAJAX呼び出し

function addComment(idP, el) { 
var comm = $(el).find("#comment").val() 
$.ajax({ 
    url: "/Post/AddComment/", 
    type: "POST", 
    data: { id: idP, comment: comm }, 
    async: true, 
    success: function (data) { 
     $(".post-comm").load("@Html.Action('Comments', 'Post', new { id = "+ idP +"})") 
    }, 
    error: function (xhr) { 
     alert("error - comment post"); 
    } 
});} 

Answer 1

[OK]をので、私はfinnalyそれをしませんでした。 私はBurakが言ったようにそれをして働いています。

私はこのような部分的なビューを返すためにAJAX呼び出しを行った：

function reloadComments(el) { 
var idP = $(el).attr("id") 
$.ajax({ 
    url: '/Post/Comments/', 
    data: { id: idP, }, 
    type: 'POST', 
    success: function (result) { 
     $(el).prevAll("div.post-comm:first").html(result); 
    }, 
    error: function (xhr) { 
     alert("error - load comments"); 
    } 
});} 

とビュー：

<div class="post-comm"> 
    @Html.Action("Comments", "Post", new { id = item.Id }) 
</div> 
@using (Ajax.BeginForm("AddComment", "Post", new AjaxOptions { HttpMethod = "POST", OnSuccess = "reloadComments(this)" }, new { id=item.Id})) 
{ 
    <input type="hidden" id="id" value="@item.Id" name="id" /> 
    <div class="form-group"> 
     <div class="col-md-12"> 
       <input class="form-control" placeholder="enter your comment..." name="comment" id="comment"> 
     </div> 
    </div> 
} 

コントローラは私の質問の最後のもののようです。
私はこの助けを借りたいと思っています