Question

我有一个ajax调用函数。在里面，我称之为局部视图。此视图用于显示注释。如何使用ajax刷新此视图？在我的上下文中我不喜欢json，因为我的linq查询是用模型设置的。所以具有局部视图的这些模型应该发送到ajax方法。 Ajax方法应该取代我的div。请注意，在调用ajax之前，应首先在页面加载时呈现此视图。我没有得到这个。我的错是什么？

 $.ajax({
        url: '/Home/Item',
        type: 'POST',
        data: { itemid: itemid },
        success: function (data) {

       $('.mycontainer').html(data);

        }
    });

控制器

        public ActionResult Item(int itemid)
    {

        FoodContext db = new FoodContext();
        ViewBag.FoodItems = db.FoodItems.Where(row => row.itemid == itemid);
        List<ImageComment> comments = (from user in db.TxtComments
                                       join o in db.Logins on user.username equals o.username
                                       where user.itemid == itemid
                                       select new ImageComment
                                       {
                                           ImageUrl = o.imgurl,
                                           Comment = user.txtcmt,
                                           ImgCmntUrl = user.imgurl,
                                           Cmntdate = user.cmtdate,
                                           Username = user.username,

                                       }).OrderByDescending(x => x.Cmntdate).ToList();

        ViewModel vm = new ViewModel { ImageComments = comments };
        return PartialView("_Comments", vm);




    }

部分视图

      @model ViewModel

     @foreach (ImageComment comment in Model.ImageComments)
     {
    <table width="100%" height="152" border="0">
  <tr>
    <td width="101" rowspan="2" valign="top"><img src="@comment.ImageUrl" width="100%" height="100%" /></td>
    <td height="27" colspan="3" valign="middle"><p> @comment.Username Commented On   On @comment.Cmntdate</p></td>
  </tr>
  <tr>

    <td colspan="2" rowspan="2"><div style="width:70%;">  

    @if (@comment.ImgCmntUrl != null)
    {
     <img src="@Url.Content(comment.ImgCmntUrl)" width="100%" height="100%" />
    }
  </div>     
   <div style="background-color:#E3EEFA;width:68%;min-height:50px;padding:5px;">@comment.Comment</div></td>
    <td width="209" height="29">&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td height="23">&nbsp;</td>
    <td>Like this.</td>
    <td>Unlike this</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td height="23">&nbsp;</td>
    <td width="303">&nbsp;</td>
    <td width="588">&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>  

     }

我的观点

<div class="mycontainer">
</div>

Answer 1

您可以使用jquery加载函数：

<div class=".mycontainer"></div>

<script>
    function ReloadComments(){
        $(".mycontainer").load("@Url.Action("Item", new { itemId = Model.Id })");
    }

    $(function(){
        setInterval(ReloadComments, 10000);
        ReloadComments();
    });
</script>

您的操作方法和部分视图无需编辑。

Answer 2

我们在项目中做了类似的事情。首先，我们有两个动作方法，一个是获取数据（没有任何视图相关的东西）并将其传递给另一个有视图的方法，它只会直接获取输入和渲染视图。

上下文是我们有一个计时器，它将在特定的时间间隔内调用ajax请求，并将数据传递给action（有视图），它将在后台更新视图。

希望我说清楚。

如何将部分视图发送到mvc4中的ajax

2 个答案: