刷新mvc中的局部视图

时间:2015-11-06 09:52:13

标签: c# sql .net ajax model-view-controller

我有一个详细视图,其中会话,甚至会话中的评论框。我在局部视图中有一个评论框。但是在决定刷新关于创建评论的对话时遇到了问题。 我知道我可以在局部视图中绑定下面的代码。但是我很难为它调用动作方法。 所以它将有详细信息查看代码,然后是代码

<div class="row">
    <div class="panel-group" id="accordion">
        @foreach (var convo in Model.TicketConversation.OrderByDescending(x => x.LastUpdatedTimestamp))
        {
            <div class="col-md-10 col-md-offset-1" style="padding-bottom: 5px;">
                <div class="panel panel-default">
                    <div class="panel-heading removePaddingBottom" data-toggle="collapse" data-target="#accord-convo-@convo.id" style="background-color: inherit;" id="accordHeading-@convo.id" onclick="javascript:showHideLastConvoMsg(@convo.id)">
                        <a style="text-decoration: none !important; color: inherit; width: 100px;">
                            <span style="font-size: 16px; font-weight: bold; vertical-align: middle !important;"><i class="fa fa-chevron-right" id="accord-heading-icon-@convo.id"></i>&nbsp;&nbsp;@convo.Subject</span>
                        </a>
                        @{ var lastmessage = convo.ConversationComments.First(); }
                        <div class="row">
                            <div id="accord-lastmsg-@convo.id" style="margin-top: 15px;">
                                <div class="@lastmessage.DisplayCssClass">
                                    <div class="row">
                                        <div class="col-md-offset-1 col-md-10 removePadding" style="margin-bottom: 5px; margin-top: 10px;">
                                            <strong>@lastmessage.TypeOfContact</strong>
                                        </div>
                                        <div class="col-md-offset-1 col-md-10 removePadding" style="margin-bottom: 10px;">
                                            @lastmessage.Message
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-md-offset-6 col-md-5 text-right text-muted" style="margin-bottom: 10px;">
                                            <small>
                                                <em>Posted by @lastmessage.CommenterName @@ @lastmessage.MessageTimestamp</em>
                                            </small>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div id="accord-convo-@convo.id" class="panel-collapse collapse">
                        <div class="panel-body" style="padding: 0;">
                            @if (convo.IsReadOnly == false @*&& Model.IsClosed == false*@)
                            {
                                <div class="row">
                                    @*<div class="col-md-12" style="padding-bottom: 3px; padding-top: 3px;">
                                        <a href="@Url.Action("ReplyQuery", new { cid = convo.id })" class="pull-right btn btn-sm btn-default"><i class="fa fa-reply"></i>&nbsp;Reply</a>
                                    </div>*@

                                    ---- here i'm calling partial view for comment box---
                            }
                            @foreach (var item in convo.ConversationComments)
                            {
                                <div>
                                    <div class="message-border @item.DisplayCssClass">
                                        <div class="row">
                                            <div class="col-md-offset-1 col-md-10 removePadding" style="margin-bottom: 5px;">
                                                <strong>@item.TypeOfContact</strong>
                                            </div>
                                            <div class="col-md-offset-1 col-md-10 removePadding" style="margin-bottom: 10px;">
                                                @item.Message
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-md-5 text-right text-muted">
                                                <small>
                                                    <em>Posted by @item.CommenterName @@ @item.MessageTimestamp</em>
                                                </small>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            }
                        </div>
                    </div>
                </div>
            </div>
        }
    </div>
</div>

可以调用哪个方法来获取会话列表?我需要写一个新的动作方法。

2 个答案:

答案 0 :(得分:1)

您可以创建一个Action方法,返回您所拥有的对话的部分视图。例如:

public class SomeCtrlController : Controller
{
    public PartialViewResult Conversation(int id)
    {
        List<Conversation> conversations = new List<Conversation>();
        //Use id to create your Model and pass it to Partial View
        conversations = PopulateConversations(id);

        // The below code search for Conversation.cshtml inside Views\SomeCtrl folder
        return PartialView(conversations);
    }
}

然后从您的cshtml(剃刀视图)中,您可以像第一次加载一样调用它:

@{ Html.RenderAction("Conversation", "SomeCtrl", new { id = 1 /*this will be id for which conversion have to load */ });}

然后要刷新对话,您可以使用jQuery ajax或get方法。这将仅刷新您指定的部分。见下面的例子

<script>
    var conversationData = {
        "id": 1 /*this will be id for which conversion have to load */
    };
    $.get("/SomeCtrl/Conversation", conversationData,
          function (returnedHtml) {
              $("#placeHolderDivToHaveConversation").html(returnedHtml);
          });
</script>

答案 1 :(得分:0)

当我需要这样做时,我使用jquery ajax。例如:

我需要动态加载以下div:

按钮视图

  <button id="buscarVideos" class="btn">Buscar</button>

我在一个事件中调用我的ajax并在那里加载de result:

成功ajax

 $("#partial_video").html(data);

部分

 <div class="col-lg-12">
            <div id="partial_video">
              @*@Html.Partial("_Player")*@
          </div>
   </div>

返回控制器

  return PartialView("_Player", video);
相关问题