Question

我正在尝试使用AJAX调用中的JSON序列化在html中显示我的父子表。但是，getJson方法的回调不会触发。我认为这是由于我的控制器中创建的JSON无效。但我在那里找不到任何问题。我的控制器方法是：

public JsonResult GetJsonData(string search)
{
  var persons = db.Person.ToList().
                Where(p => p.FirstName == search || p.LastName == search).ToList();         
  JsonResult json = Json(persons, JsonRequestBehavior.AllowGet);
  return json;
}

我的模型如下：

public class Person
{
   public Person()
   {
      this.Interests = new HashSet<Interest>();
   }

   [DisplayName("PersonID")]
   public int PersonID { get; set; }
   [DisplayName("FirstName")]
   public string FirstName { get; set; }
   [DisplayName("LastName")]
   public string LastName { get; set; }
   [DisplayName("Address")]
   public string Address { get; set; }
   [DisplayName("Age")]
   public int? Age { get; set; }
   [DisplayName("Photo")]
   public string Photo { get; set; }
   [DisplayName("Interests")]
   public virtual ICollection<Interest> Interests { get; set; }
}

并且子类是：

public class Interest
{       
    [DisplayName("InterestId")]
    public int InterestId { get; set; }
    [DisplayName("InterestValue")]
    public string InterestValue { get; set; }
    [DisplayName("PersonId")]
    public int PersonId { get; set; }

    public virtual Person person { get; set; }
}

我的观点包含以下代码：

<script type="text/javascript">
    $(document).ready(function () {        
        $('#btnGetPersons').click(function () {
            var searchKey = $("#txtBoxPersonSearch").val();
            $.getJSON("/Person/GetJsonData", { search: searchKey }, function (data) {                
                for (var i = 0; i < data.length; i++) {
                    drawRow(data[i]);
                }
            });
        });
    });

    function drawRow(rowData) {
        debugger;
        var row = $("<tr/>")
        var img = "<img src=" + "~/Images/" + rowData.Photo + " />";

        $("#personDataTable").append(row);
        row.append($("<td>" + rowData.FirstName + "</td>"));
        row.append($("<td>" + rowData.LastName + "</td>"));
        row.append($("<td>" + rowData.Address + "</td>"));
        row.append($("<td>" + rowData.Age + "</td>"));
        row.append($("<td>" + rowData.Interests + "</td>"));
        row.append($("<td>" + img + "</td>"));
    }

</script>

请注意，当我没有在Person类的Interests实体上保持序列化时，该表填充了除Interests之外的值。

现在，当我调试控制器方法时，JSON结果似乎正确填充了人员数据中的Person数据和兴趣数据，但仍然我的getJson方法没有回调，我无法用数据填充表。任何帮助表示赞赏。感谢。

Answer 1

很可能是Rory评论中的路由问题。

更改以下内容的第4行：

    $(document).ready(function() {
      $('#btnGetPersons').click(function() {
        var searchKey = $("#txtBoxPersonSearch").val();
        $.getJSON("/Person/GetJsonData", {
          search: searchKey
        }, function(data) {
          for (var i = 0; i < data.length; i++) {
            drawRow(data[i]);
          }
        });
      });
    });

对此：

    $(document).ready(function() {
      $('#btnGetPersons').click(function() {
        var searchKey = $("#txtBoxPersonSearch").val();
        $.getJSON('@Url.Action("GetJsonData", "Person")', {
          search: searchKey
        }, function(data) {
          for (var i = 0; i < data.length; i++) {
            drawRow(data[i]);
          }
        });
      });
    });

区别在于'@ Url.Action（“Action”，“Controller”）' - 这会创建应用程序资源的正确相对路径。

最后，在你的控制器中试试这个：

return Json (new { result = persons } );

然后你的js改变如下：

 $.getJSON("/Person/GetJsonData", { search: searchKey }, function (data) {                
            for (var i = 0; i < data.result.length; i++) {
                drawRow(data.result[i]);
            }
        });

最后一件事是改变你的ajax调用：

 $.ajax({
        url: '/controller/action',
        contentType: "application/json",
        dataType: 'json',
        type: 'GET'
        }).success(function (data) {
           alert(data.result);
        }).error(function (xhr, status) {
           alert(status);
        })

Answer 2

与@Denys一起说到您的URL，您还应该更改控制器GetJsonData代码。除非您启用了lazing加载，否则如果您不使用Include，则不会获得任何兴趣信息。您还应该在search之前过滤ToList，或者从数据库中获取每个人的记录。

public JsonResult GetJsonData(string search)
{
    var persons = db.Person
                    .Include("Interests")
                    .Where(p => p.FirstName == search || p.LastName == search)
                    .ToList();

    return Json(persons, JsonRequestBehavior.AllowGet); 
}

刚刚意识到您可能会收到circular reference错误，因为Interests也有Person。您应该创建一个viewmodel，而不是尝试序列化该实体。

尝试返回匿名类型，看看你是否收到了数据。

public JsonResult GetJsonData(string search)
{
    var persons = db.Person
                    .Include("Interests.Person")
                    .Where(p => p.FirstName == search || p.LastName == search)
                    .Select(p => new
                    {
                        FirstName = p.FirstName,
                        LastName = p.LastName,
                        Address = p.Address,
                        Age = p.Age,
                        Photo = p.Photo,
                        Interests = p.Interests.Select(i => new { 
                           FirstName = i.Person.FirstName,
                           LastName = i.Person.LastName
                        })
                    })
                    .ToList();

    return Json(persons, JsonRequestBehavior.AllowGet); ;
}

为MVC中的父子模型创建的JSON结果不正确

2 个答案: