2

asp.net mvc3 の div の ajax 更新で問題に直面しています。

コンテンツのあるビューがあります

<div id="post_comments">
   @{Html.RenderPartial("_RefreshComments", Model);}
 </div>
<div id="commentForm">
@using (Ajax.BeginForm("Details", new { id = Model.Post.PostId }, new AjaxOptions
           {
              HttpMethod = "POST",
              InsertionMode = InsertionMode.InsertAfter, 
              UpdateTargetId = "post_comments"
            }
          ))
{
// form content goes here
<p id="buttons">
    <input type="submit" value="@Strings.Save" />
</p>
}

これは私の部分的な見方です

@model Project.Models.Posts.PostDetailsViewModel   

@{ 
    foreach (var c in Model.ApprovedComments)
    { 
        @Html.DisplayFor(x => c)        
    } 
}

私はコントローラーを持っています

public ActionResult Details(int id, FormCollection form )
{
    var model = new PostDetailsViewModel(UnitOfWork, id);
    return PartialView("_RefreshComments", model);

}

私のレイアウトcshtmlに次のスクリプトが含まれています

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

そしてまた

  <appSettings>
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
  </appSettings>

コメントを追加することはできますが、コントローラーはレイアウトに含まれていない PartialView のみを返します。ASP.net MVC3 - Razor Views and PartialViews with Ajax Postbacksが見つかりましたが、そこからは何も役に立ちませんでした。

誰にもアイデアはありますか？

4

2 に答える 2

2

jquery ajax を使用してアクションを呼び出し、コントローラーから部分ビューを返します。次に、jquery を使用して、返された html をコンテナにリロードします。

まず、更新ボタンまたは ajax イベントをトリガーできるものを追加します...次に、以下の JavaScript を実行します。

次のようにします。

<div id="post_comments">     
  @{Html.RenderPartial("_RefreshComments", Model);}    
</div>
<div id="commentForm">
  @using (Ajax.BeginForm("Details", new { id = Model.Post.PostId }, new AjaxOptions    
  {
     HttpMethod = "POST",
     InsertionMode = InsertionMode.InsertAfter, 
     UpdateTargetId = "post_comments"
  }
))
{
// form content goes here
<p id="buttons">
  <input type="submit" value="@Strings.Save" />
  <input type="button" id="refreshButton" value="Refresh" />"
</p>
}





$('#refreshButton').click(function(){
   $.ajax({
      url: 'controller/Details.aspx',
      datatype: 'html',
      success: function(data) {
         $('#post_comments').empty().html(data);
      }
   }); 
});

明らかに、URL はアクションへのルートである必要があります。それ以外は、これでうまくいくはずです。

于 2012-05-12T17:48:09.613 に答える