嵌套模型不绑定

时间:2012-10-24 10:32:42

标签: ajax asp.net-mvc-3 model-binding

我想将JSON数据结构传递给MVC(3)控制器,将JSON对象转换为C#对象,并绑定所有属性。其中一个属性是简单类型。这是基本的模型绑定,对吧?

以下是我的模特:

public class Person
{
    public string Name { get; set; }
    public JobTitle JobTitle { get; set; }
}

public class JobTitle
{
    public string Title { get; set; }
    public bool IsSenior { get; set; }
}

这是我的Index.cshtml页面(它发出一个AJAX请求,传入一个匹配“Person”类结构的JSON对象):

<div id="myDiv" style="border:1px solid #F00"></div>
<script type="text/javascript">
var person = { 
        Name: "Bob Smith",
        JobTitle: { 
            Title: "Developer",
            IsSenior: true
        } 
    };

$.ajax({
    url: "@Url.Action("ShowPerson", "Home")",
    data: $.param(person),
    success: function (response){
        $("#myDiv").html(response);
    },
    error: function (xhr) {
        $("#myDiv").html("<h1>FAIL</h1><p>" + xhr.statusText + "</p>");
    }
});
</script>

我的HomeController看起来像这样:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    public ActionResult ShowPerson(Person person)
    {
        return View(person);
    }
}

暂时忽略“ShowPerson.cshtml”文件,因为在需要之前会出现问题。

在HomeController.ShowPerson操作中,“person.Name”属性被正确绑定,“person.JobTitle”对象(包含“Title”和“IsSenior”属性)被实例化,但仍然具有默认值“Title” = null“和”IsSenior = false“。

我确信我在过去没有遇到任何问题的嵌套模型绑定。我错过了什么?任何人都可以解释为什么模型绑定似乎只能在一个层次上工作吗?

我搜索了SO,似乎其他人在从表单发送数据时遇到了绑定问题,所以也许我在$ .ajax()请求中遗漏了一些东西?

2 个答案:

答案 0 :(得分:6)

好的,你需要做一些改变,

  • dataType 设为json
  • contentType 设置为application/json; charset=utf-8
  • 使用JSON.stringify()

下面是修改后的代码。 (测试

var person = { 
    Name: "Bob Smith",
    JobTitle: { 
        Title: "Developer",
        IsSenior: true
    } 
};

var jsonData = JSON.stringify(person);

$.ajax({
  url: "@Url.Action("ShowPerson", "Home")",
  data: jsonData,
  dataType: 'json',
  type: 'POST',
  contentType: "application/json; charset=utf-8",

  success: function (response){
    $("#myDiv").html(response);
  },
  error: function (xhr) {
    $("#myDiv").html("<h1>FAIL</h1><p>" + xhr.statusText + "</p>");
  }
});

答案 1 :(得分:0)

将内容类型添加到ajax

contentType: "application/json; charset=utf-8",
dataType: 'json',
type: 'POST',
data: $.toJSON(person);