如何关闭弹出窗口中打开的局部视图并刷新主页?

时间:2012-01-12 14:49:57

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

我正在使用弹出窗口中显示的部分视图来编辑在主窗口中单击的记录的详细信息。在此视图中,用户可以编辑,删除或取消。成功编辑或删除详细记录后,我想关闭局部视图并更新主窗口。现在,在删除时,我的主视图在弹出成功时重新加载。

非常感谢任何有助于此工作的帮助。

HTML:

`<a href="javascript:popup('@Url.Action("EditCaseEmployer/" + item.Id, "CaseOptions")')">@item.StartDate.ToShortDateString()</a>`

以下是弹出窗口的自定义javascript函数:

function popup(url) {
window.open(url, 'notes', 'width=900,height=600,scrollbars=yes,resizable=yes,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0');
}
function popup(url, windowName) {
window.open(url, windowName, 'width=900,height=600,scrollbars=yes,resizable=yes,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0');
}

1 个答案:

答案 0 :(得分:0)

您可以将布尔属性添加到您在部分中使用的视图模型中:

public class MyViewModel
{
    public MyViewModel()
    {
        ShouldReload = false;
    }
    public bool ShouldReload { get; set; }

    // Some properties
    public string Foo { get; set; }
}

然后在部分测试其值并刷新opener并关闭弹出窗口:

@model MyViewModel

@if (Model.ShouldReload)
{
    <script type="text/javascript">
        // refresh the parent window
        window.opener.location.reload();

        // close the popup
        window.close();
    </script>
}
else
{
    using (Html.BeginForm())
    {
        @Html.LabelFor(x => x.Foo)
        @Html.EditorFor(x => x.Foo)
        <button type="submit">OK</button>
    }
}

现在剩下的就是2个控制器动作,它们将分别显示部分并处理它:

public ActionResult Dialog()
{
    var model = new MyViewModel();
    return PartialView(model);
}

[HttpPost]
public ActionResult Dialog(MyViewModel model)
{
    if (!ModelState.IsValid)
    {
        // the model is invalid => redisplay the partial
        return PartialView(model);
    }
    // TODO: at this stage the model is valid 
    // => pass it to the service layer for processing

    // everything went fine => set the ShouldReload flag to true
    // so that the view refreshes its opener and closes itself
    model.ShouldReload = true;
    return PartialView(model);
}
相关问题