在该局部视图内发生操作后刷新主视图中的局部视图

时间:2012-10-29 14:09:38

标签: c# asp.net-mvc-3 entity-framework razor

我的部分视图位于我的主视图中:

 <div id="complaintlist">
    @Html.Action("ShowCaseComplaints", "Cases", new { caseid = Model.CasesID })
</div>

这是局部视图:

@model IEnumerable<cummins_db.ViewModels.CaseComplaintsViewModel>

<table width="100%">
 <tr>
    <th></th>
    <th></th>
    <th>Complaint Code</th>
    <th>Complaint Description</th>
    <th>Delete</th>
</tr>  
@foreach (var item in Model)
    {
<tr>
    <td>
         @Html.HiddenFor(modelItem => item.CasesID )    
    </td>
    <td>
        @Html.HiddenFor(modelItem => item.CaseComplaintID )    
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.ComplaintCode )    
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.ComplaintType)
    </td>
    <td>
        @Ajax.ActionLink("Delete", "RemoveCodeFromCase", "Cases", new { caseid = item.CasesID, id = item.CaseComplaintID }, null)
    </td>        
 </tr>
    }
 </table>

此部分视图具有允许用户在局部视图中从模型中删除记录的操作。以下是名为RemoveCodeFromCase的操作:

public ActionResult RemoveCodeFromCase(int caseid, int id)
        {
        if (ModelState.IsValid)
            {
            CaseComplaint c = db.CaseComplaints.Find(id);
            db.CaseComplaints.Remove(c);
            db.SaveChanges();

            var data = (from C in db.CaseComplaints
                        where C.CasesID == caseid
                        select new CaseComplaintsViewModel()
                        {
                            CasesID = C.CasesID,
                            CaseComplaintID = C.ComplaintCodeID,
                            ComplaintCode = C.ComplaintCode.ComplaintCodeName,
                            ComplaintType = C.ComplaintCode.ComplaintType
                        }).ToList();


            return PartialView("_CaseComplaintCodes", data);

            }

        return PartialView("_CaseComplaintCodes");
        }

我试图了解在此操作运行后如何刷新部分视图。

THX

2 个答案:

答案 0 :(得分:2)

您正在使用的Ajax扩展方法将使用jQuery Unobtrusive Ajax扩展,它允许您呈现客户端的结果。 您需要在视图中包含jquery.unobtrusive-ajax.js,然后指定要在其中呈现操作结果的目标ID。假设它是原始容器,它看起来像这样:

@Ajax.ActionLink("Delete", "RemoveCodeFromCase", "Cases", new { caseid = item.CasesID, id = item.CaseComplaintID },  new AjaxOptions { UpdateTargetId = "complaintlist" }, null)

答案 1 :(得分:1)

我必须使用ajax才能实现您想要实现的目标,因为在您的操作发生时无法刷新页面请阅读本文

http://www.codemein.net/2012/05/how-to-refresh-partial-view-with-ajax-asp-net/