title: Issue returning 'PartialView' inside JSON response
body: <p>I have a partial that I am reloading after an Ajax call. The following code works:</p>
  
  <pre><code>public PartialViewResult AddPreferredPosition(string playerID, int positionID)
      {
              playerService.AddPlayerPreferredPosition(Guid.Parse(playerID), positionID);
  
              PreferredPositionsModel model = new PreferredPositionsModel();
              model.PreferredPositions = playerService.GetPlayerPreferredPositions(Guid.Parse(playerID));
              model.Positions = playerService.GetPositions();
          return PartialView("~/Areas/Admin/Views/Player/Partials/PreferredPositions.cshtml", model);
      }
  </code></pre>
  
  <p>along with:</p>
  
  <pre><code>var params = {};
      params.playerID = $('#PlayerID').val();
      params.positionID = $("select[name='ddlPositionID'] option:selected").val();
      $.ajax({
          type: 'POST',
          url: '/Admin/Player/AddPreferredPosition',
          data: params,
          success: function (data) {
                  $('#PreferredPositions').html(data);
          }
      });
  </code></pre>
  
  <p>I want to alter it slightly to manage my error handling further to something like this:</p>
  
  <pre><code>public ActionResult AddPreferredPosition(string playerID, int positionID)
      {
          try
          {
              playerService.AddPlayerPreferredPosition(Guid.Parse(playerID), positionID);
  
              PreferredPositionsModel model = new PreferredPositionsModel();
              model.PreferredPositions = playerService.GetPlayerPreferredPositions(Guid.Parse(playerID));
              model.Positions = playerService.GetPositions();
  
              return Json(new
              {
                  Success = true,
                  HTML = PartialView("~/Areas/Admin/Views/Player/Partials/PreferredPositions.cshtml", model)
              }, JsonRequestBehavior.AllowGet);
          }
          catch (Exception ex)
          {
              return Json(new
              {
                  Success = false,
                  ErrorMessage = ex.Message,
                  InnerException = (ex.InnerException != null ? ex.InnerException.Message : ""),
                  ex.StackTrace
              });
          }
      }
  </code></pre>
  
  <p>with:</p>
  
  <pre><code>$.ajax({
          type: 'POST',
          url: '/Admin/Player/AddPreferredPosition',
          data: params,
          success: function (data) {
              if (data.Success) {
                  $('#PreferredPositions').html(data.HTML);
              } else {
                  alert(data.ErrorMessage);
                  console.log(data.StackTrace);
              }
          }
      });
  </code></pre>
  
  <p>However, when I do this then <code>data.HTML</code> is not the compiled partial view's HTML, as it is in the working example.</p>
  
  <p>What am I doing wrong?</p>