提交部分视图的表单时刷新父视图 [英] Refreshing parent view when a partial view's form is submitted

问题描述

我正在研究使用Razor在MVC3中使用部分视图，并且可以渲染部分视图，并且效果很好. 不过，我想做的是在提交部分视图时刷新父视图.

I'm looking into using partial views in MVC3 using Razor, and I get my partial view to render and it works fine. What I'd like to do, though, is refresh the parent view when the partial view is submitted.

父视图中的代码以呈现部分视图

Code in my parent view to render partial view

<div id="mydiv">
@{ Html.RenderAction("Add", "Request"); }
</div>

父视图的操作很简单，

public ActionResult Index()
{
  List<obj> reqs = //some query
  return View(reqs);
}

在我的部分视图中，执行以下操作:

In my partial view's get action I have:

public ActionResult Add()
{
  AddRequestViewModel vm = new AddRequestViewModel();
  //set some stuff on the VM here
  return PartialView(vm);
}

在部分视图调用的post操作中，如果modelstate无效，则return PartialView(vm)

In the post action called by the partial view, if modelstate isn't valid, return PartialView(vm)

如果有效，我希望刷新父视图和局部视图. 我尝试了RedirectToAction，但是显然不能在部分调用的动作中调用它，而我尝试了return Index();，但这会导致用于渲染部分视图的代码出现问题

If it is valid, I'd like the parent and partial views to refresh. I tried RedirectToAction, but this can't be called in an action called by a partial, apparently, and I tried return Index();, but this causes an issue with the code used to render the partial view,

Exception Details: System.InvalidOperationException: The model item passed into the dictionary is of type 'System.Collections.Generic.List'1[DatRequests.Models.ReqRequest]', but this dictionary requires a model item of type 'DatRequests.ViewModels.AddRequestViewModel'.

任何有关如何执行此操作的建议将不胜感激.该页面的目的是显示元素列表，而局部页面包含一个向列表添加新元素的表单.

Any suggestions on how to do this would be appreciated. The purpose of the page is to show a list of elements, and the partial contains a form to add a new element to the list.

Edit:局部模型是不同的，因为它包含来自db的供选择的数据，这就是为什么我尝试了RenderAction的原因，但是我不确定是否还有其他方法可以做到这一点.

The partial's model is different, as it contains data for selection, which is from a db, which is why I tried RenderAction, but I'm not sure if there are other ways of doing this.

推荐答案

正常提交部分视图后，您将其提交给某些控制器操作.您可以使用普通请求或AJAX请求提交.如果您使用普通请求，则可以在处理表单提交的POST控制器操作中执行对Index的标准重定向.如果使用AJAX，则可以返回指向要重定向的URL的JSON结果:

When the partial view is submitted normally you submit it to some controller action. You could either submit it using a normal request or an AJAX request. If you use a normal request you could perform a standard redirect to the Index inside the POST controller action that will handle the form submission. If you use AJAX, you could return a JSON result pointing to the url that you want to redirect:

[HttpPost]
public ActionResult Foo(MyViewModel model)
{
    if (!ModelState.IsValid)
    {
        return PartialView(model);
    }
    return Json(new { url = Url.Action("Index") });
}

并在您的AJAX成功回调中:

and inside your AJAX success callback:

success: function(result) {
    if (result.url) {
        // we have a success
        window.location.href = result.url;
    } else {
        // invalid modelstate => refresh the partial
        $('#mydiv').html(result);
    }
}

这篇关于提交部分视图的表单时刷新父视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！