如何在Controller中获取从ActionResult返回的html

Question

我正在尝试实现类似于 StackOverflow 上的相关问题的功能，我正在 MVC 中执行此操作。

$().ready(function() {
   var s = $("#Summary").val();
   $("#Summary").blur(function() { QuestionSuggestions(s); });
});

function GetPastIssues(title) {

$(document).ready(function() {
$.ajax({ type: "POST",
    url: "/Issue/GetSimilarIssues",
    contentType: "application/json; charset=utf-8",
    dataType: "xml",
    dataType: "json",
    data: "{'title':'" + title + "'}",
    processData: false,
    error: function(XMLHttpRequest, textStatus, errorThrown) { ajaxError(XMLHttpRequest, textStatus, errorThrown); },
    success: function(xml) { ajaxFinish(xml); }
  });
});

function ajaxFinish(xml) {
 if (xml.d != "NO DATA") {
    $('#question-suggestions').html(xml.d); //alert(xml.d); // This ALERT IS returning undefined
    $('#question-suggestions').show();
 }
}

从我的控制器返回的数据是“未定义的”，如 ajaxFinish 中的注释行所示。
我做错了什么？

//[AcceptVerbs(HttpVerbs.Get)]
[JsonParamFilter(Param = "title", TargetType = typeof(string))]
public ActionResult GetSimilarIssues(string title)
{
    var issues = _db.GetSimilarIssues(title).ToList();
    if (title == null || issues.Count() == 0)
       return Json("NO DATA");

    string retVal = null;
    foreach (Issue issue in _db.GetSimilarIssues(title))
    {
        retVal += "<div class='answer-summary' style='width: 610px;'>";
        retVal += "<a href='Issue.aspx?projid=" + issue.ProjectId.ToString() + "&issuetypeid=" + issue.IssueTypeId.ToString() +
                "&issueid=" + issue.IssueId.ToString() + "'>";
        retVal += issue.Summary;
        retVal += "</a>";
        retVal += "</div>";
    }
        return Json(retVal);
  }

编辑：

我认为，如果我能深入了解 StackOverflow 如何实现此 javascript 方法，将有助于我学习和实施解决方案：

function QuestionSuggestions() {
        var s = $("#title").val();            
        if (s.length > 2) {
            document.title = s + " - Stack Overflow";
            $("#question-suggestions").load("/search/titles?like=" + escape(s));
        }

看起来像 Views 文件夹中的“Search”文件夹和名为“Title”的PartialView。 SearchController.cs，方法如下：

public ActionResult titles(string like)
{
   // HOW TO IMPLEMENT THIS
   return PartialView("Titles");
}

在 Titles.ascx 中显示 html 的内容是什么？

Answer 1

JSON() 的目的是返回一个 JSON 对象——而不是 HTML。 JSON 对象类似于 {html_value: "

blah" }。我不确定您的 ajax 请求在期待什么。如果它期待 JSON（您设置了两次 dataType），那么您可以对匿名对象执行类似操作：

return Json(new {html_value = retVal});

但是，如果您想从控制器返回 HTML，请不要。这正是视图的用途。创建一个没有任何母版页的视图并执行循环并以这种方式返回 HTML。 Ajax 应用程序可以获取此 HTML 并将其放在任何需要的地方。

事实上，虽然您在技术上可以执行上述匿名对象（您在 json 对象中返回 html），但这不是它的用途。如果您想使用 JSON，您应该返回值，并让客户端上的 javascript 对其进行格式化：

我不确定您的问题对象有多“重”，但假设它只有您正在使用的三个字段。在这种情况下，请执行以下操作：

return Json(issues);

编辑：

嗯，我认为“最佳实践”是通过 JSON 和 javascript 中的格式返回值。我对 JSON() 不够熟悉，但我知道它可以工作（我将它用于简单的事情）。尝试使用这三个值创建一个简单的问题对象，然后

return Json(issuesTxfr);

当您从控制器调用时，您不需要使用局部视图。只需将其视为一个非常简单的视图。这是我的一个例子（请注意，我没有遵循我自己的 JSON 建议——这是不久前的事了，我现在看到它有几个原因）：

    public ActionResult Controls_Search_Ajax(string q, string el)
    {
        ...

        ViewData["controls"] = controls;
        ViewData["el"] = el;

        return View();
    }

和

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Controls_Search_Ajax.aspx.cs" Inherits="IRSoxCompliance.Views.Edit.Controls_Search_Ajax" %>
<% var controls = ViewData.Get<IEnumerable<IRSoxCompliance.Models.Control>>("controls");
   var el = ViewData.Get<String>("el");

   if (controls != null)
   {
     foreach (var c in controls)
     {
%><%= c.Control_ID %>***<%= c.Full_Control_Name %>***<li id="<%= el %>:li:<%= c.Control_ID %>"><span class="item"><%= Html.BreadCrumb(c, false) %></span><span class="actions"><a href="#" onclick="sx_Remove_Control('<%= el %>', <%= c.Control_ID %>); return false;">Remove</a></span><br></li>
<%   }
   }
%>

请注意没有指定母版页。

Answer 2

您总是可以将 HTML 作为字符串返回。我并不是说这必然是要走的路，我同意 James Shannon 关于不使用 JSON 返回 HTML 的观点。

Phil Haack 早在 5 月就在他的博客上写了一篇很棒的 article。