asp.net-mvc - 如何获取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();
 }
}

从我的 Controller 返回的数据是“未定义的”，如 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 方法，那将有助于我学习和实现我的 senario 的解决方案:

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(你设置了两次数据类型)，那么你可以用匿名对象做一些事情:

return Json(new {html_value = retVal});

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

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

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

return Json(issues);

编辑:

好吧，我认为“最佳实践”是通过 JSON 和 javascript 中的格式仅返回值。我对 JSON() 不够熟悉，但我知道它有效(我将它用于一些简单的事情)。尝试创建一个仅包含这三个值的简单问题对象，

return Json(issuesTxfr);

您不需要使用局部 View ，因为您是从 Controller 调用的。只需将其视为一个非常简单的 View 即可。这是我的一个例子(请不要注意到我没有遵循我自己的 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>
<%   }
   }
%>

请注意，没有指定母版页。