小编典典

ASP.NET MVC使用jQuery Ajax渲染部分视图

ajax

我有一个呈现部分视图的控制器动作:

public ActionResult Details(int id)
{
    DetailsViewModel model = 
        ModelBuilder.GetDetailsViewModel(id, _repository);
    return PartialView("Details", model);
}

然后将返回的内容加载到动态元素中,如下所示:

$container = appendContainer(); // adds a div to the dom with the correct id
$container.load("MyController/Details", function(response, status, xhr) {
    if (status != "success") {
        $(container).html('an error has occured');
    }
});

因此,这将创建一个div,然后将返回的内容加载到该div中。

我想对此稍作更改,以便仅在对控制器的调用成功的情况下创建容器div。

所以:

  1. jQuery调用控制器动作
  2. 控制器返回PartialView,如果找不到ID,则返回null
  3. 如果返回PartialView,则将创建容器并使用返回的内容加载该容器。
  4. 如果控制器找不到ID,则不会创建任何内容并显示警报。

我会很感激我如何最好地实现这一目标。


阅读 285

收藏
2020-07-26

共1个答案

小编典典

所有load所做的就是返回HTML从服务器,那么为什么不只是追加到一个临时DIV,然后从中获得HTML上的成功?

var $dummy = $("<div>");
$dummy.load("MyController/Details", function(response, status, xhr) {
    var $container = appendContainer();
    if (status != "success") {
        $container.html('an error has occured');
    }
    else
    {
        $container.html($dummy.html());
    }
    $dummy.remove();
});

更新:

如果您期望出现异常,则应该处理它。如果您基本上只是允许错误发生status != "success",那是一种严重的代码味道。您应该捕获该错误并返回另一个PartialView。

public ActionResult Details(int id)
{
    try
    {
        DetailsViewModel model = 
            ModelBuilder.GetDetailsViewModel(id, _repository);
        return PartialView("Details", model);
    }
    catch (SomeException ex)
    {
        return PartialView("Error", ex.Message);
    }
}

这样就可以确保始终获得有效的HTML响应,否则,您的基本错误an error occured将发挥作用。

2020-07-26