Question

我在其中一个页面上设置了评论部分。父视图有一个局部视图，显示该ID的注释，并提供显示另一个部分视图以发布注释的选项。当有人发表评论时，我希望父母中的第一个部分视图刷新以显示新评论。

目前，当您单击“发表评论”时，将调用AddComment方法并将其添加到数据库中。我得到一个错误，说我将错误类型的模型传递给视图。它似乎试图将返回值传递给我的AddComment局部视图，而不是将其注入Partent View Div。

父视图

@model QIEducationWebApp.Models.Course

@{
    ViewBag.Title = "Course Details";
}

<h1 class="page-header">@ViewBag.Title</h1>


Javascript is here
.
.
.

<table class="table">

        DETAILS HERE

</table>


<ul id="view-options">
    <li>@Html.ActionLink("Back to Courses", "Index", "Course")</li>
</ul>

<input type="button" id="View" class="ShowComment" value="Show Comments"/>


<div id="CommentSection"/>

查看评论的部分视图

Javascript is here
.
.
.

<div class="CommentSection">
    @foreach (var item in Model)
    {
        <div class="Comment">
            <div class="CommentText">
                @Html.DisplayFor(modelItem => item.CommentText)
            </div>
            <div class="CommentSep">
                <span class="Commenter">@Html.DisplayFor(modelItem => item.UserName)</span> - <span class="CommentDate">@Html.DisplayFor(modelItem => item.CommentDate)</span>
            </div> 
        </div>     
    }

    <input type="button" id="Post" class="AddComment" value="Add a Comment"/>
    <br />
    <br />
</div>

<div id="AddComment" />

    <br />
    <br />
    Page @(Model.PageCount < Model.PageNumber ? 0 : Model.PageNumber) of @Model.PageCount

    @Html.PagedListPager(Model, page => Url.Action("ViewComments",
    new { courseID = @ViewBag.courseID, page }),
            PagedListRenderOptions.EnableUnobtrusiveAjaxReplacing(
                new PagedListRenderOptions { MaximumPageNumbersToDisplay = 5, DisplayLinkToFirstPage = PagedListDisplayMode.IfNeeded, 
                DisplayLinkToLastPage = PagedListDisplayMode.IfNeeded },
                new AjaxOptions() { HttpMethod = "GET", UpdateTargetId = "CommentSection" }))

背后的方法是局部视图

public PartialViewResult ViewComments(int courseID, int? page = 1)
        {
            ViewBag.courseID = courseID;
            var coursecomments = db.CourseComments.Where(cc => cc.CourseID == courseID);
            int pageSize = 10;
            int pageNumber = (page ?? 1);
            return PartialView(coursecomments.OrderByDescending(cc => cc.CommentDate).ToPagedList(pageNumber, pageSize));
        }

部分发表评论

Javascript is here
.
.
.

@using (Ajax.BeginForm("AddComment", "CourseComment", new { courseID = @ViewBag.courseID, userName = @User.Identity.Name },
    new AjaxOptions { UpdateTargetId = "CommentSection" }))
{
    @Html.ValidationSummary(true)

    <div class="NewComment">
        <div class="editor-field">
            @Html.TextAreaFor(model => model.CommentText, new { maxLength = 500 })
            @Html.ValidationMessageFor(model => model.CommentText)
        </div>
        <input type="submit" class="PostComment" value="Post Comment" />
        <div id="Counter" class="CommentCounter"/>
    </div>


}

链接到发表评论Ajax.BeginForm（）

的控制器方法

public PartialViewResult AddComment(CourseComment coursecomment, int courseID, String userName)
{
    coursecomment.CommentDate = System.DateTime.Now;
    coursecomment.CourseID = courseID;
    coursecomment.UserName = userName;
    if (ModelState.IsValid)
    {
        db.CourseComments.AddObject(coursecomment);
        db.SaveChanges();
    }

    ViewBag.courseID = courseID;
    return ViewComments(courseID);

}

添加图片

详细

enter image description here