ASP.NET AJAX MVC3局部视图刷新 [英] ASP.NET MVC3 ajax partial view refresh

问题描述

我现在面临使用div在asp.net MVC3 AJAX更新的问题。

I am facing a problem with ajax updating of div in asp.net mvc3.

我有内容的图

<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)        
    } 
}

我有一个控制器

I have a controller

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

}

我有以下脚本包含在我的布局CSHTML

I have following script included in my layout cshtml

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

和也

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

很灵，我可以添加注释，但是控制器仅返回PartialView，不包含在布局中。我发现<一href="http://stackoverflow.com/questions/4888521/asp-net-mvc3-razor-views-and-partialviews-with-ajax-postbacks">ASP.net MVC3 - 剃刀从那里查看和PartialViews与阿贾克斯回发但没有什么帮助了我。

It really works, I am able to add comments, but controller only returns the PartialView, not contained in the layout. I am found ASP.net MVC3 - Razor Views and PartialViews with Ajax Postbacks but nothing from there helped me.

有没有人有什么想法？

推荐答案

我会使用jQuery AJAX调用操作，然后从控制器返回的局部视图。然后重新装入返回的HTML到使用jQuery的容器。

I would use jquery ajax to call the action and then return the partial view from the controller. Then reload the returned html into the container using jquery.

首先，添加一个刷新按钮或东西可以触发Ajax事件......然后做下面的JavaScript。

First, add a refresh button or something you can trigger the ajax event... then do the below 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);
      }
   }); 
});

显然，链接需要被路由到你的动作。除此之外，这应该做工精细你。

Obviously, the url needs to be the route to your action. Other than that, this should work fine for you.

这篇关于ASP.NET AJAX MVC3局部视图刷新的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！