c# - 如何在 MVC3 中更新部分显示 View

Question

我有一个调用局部 View 的 View :

Html.RenderPartial

我想使用 Controller 方法单独调用它来停止必须刷新整个页面，但返回 void 的 Controller 方法似乎会破坏现有 View (我得到一个空白屏幕)。

我有更新 HTML 文档部分的 javascript 代码，但我看不到如何在 Controller 中保留 View /获取对它的引用以调用 javascript 方法。

我应该补充一点，我对这个 MVC3 东西还很陌生。

注意长话短说，使用 JQuery 不是一种选择，因此不幸的是我们仅限于 Javascript。

Answer 1

基本模式是在 Controller 中创建一个 PartialView 结果，并使用该结果更新页面上某些容器的 innerHTML:

HTML

<input type="button" onclick="UpdateMyContainer();" value="Update" />

<div id="MyContainer">
    @Html.Partial( "_MyPartialView", Model )
</div>

JavaScript

关注Ajax without jQuery for beginners用于创建不需要 JQuery 的 Ajax 方法。本质上:

function UpdateMyContainer() {
  var xmlHttp = createXMLHttp();
  // set your controller URL here:
  xmlHttp.open('get', 'Url/To/SomeMethodInController', true);
  xmlHttp.send(null);
  xmlHttp.onreadystatechange = function() {
    if (xmlHttp.readyState === 4) {
      if (xmlHttp.status === 200) {
        // Set the Id of the container to update here:
        document.getElementById('MyContainer').innerHTML = xmlHttp.responseText;
      } else {
        alert('Error: ' + xmlHttp.responseText);
      }
    } else {
      //still loading
    }
  };
}

上述 JS 可以进一步重构以接收要更新的 URL 和元素 ID。

Controller

[HttpPost]
public PartialViewResult SomeMethodInController()
{
    var model = MethodToRetreiveModel();

    return PartialView( "_MyPartialView", model );
}