ASP.NET MVC 3 Json Model Binding with 3 levels object

Question

Why doesnt 3 level nesting model binding from json work?

Testing with 2 levels, say adding a string property on LevelTwo, works, but 3 levels doesnt? Is this by design, a bug, or am I missing something?

Client side jQuery post:

    $.ajax({
        url: "MyController/MyAction",
        dataType: "json",
        type: "POST",
        cache: false,
        data: {
            Level1: {
                Level2: {
                    StringValue: "Test"
                }
            }
        }
    });

Server side model:

public class MyForm
{
    public LevelOne Level1 { get; set; }
}

public class LevelOne
{
    public LevelTwo Level2 { get; set; }
}

public class LevelTwo
{
    public string StringValue { get; set; }
}

Darin Dimitrov · Accepted Answer · 2011-11-02 12:26:25Z

1

Why doesnt 3 level nesting model binding from json work

You are not sending any JSON to the server. If you want to send a JSON request here's how:

$.ajax({
    url: "MyController/MyAction",
    contentType: 'application/json; charset=utf-8',
    dataType: "json",
    type: "POST",
    cache: false,
    data: JSON.stringify({ 
        Level1: { 
            Level2: { 
                StringValue: "Test" 
            } 
        } 
    })
});

The JSON.stringify method is what serializes the javascript literal into a JSON string. It is natively built in modern browsers. If you need to support legacy browsers you could include the json2.js script to your page.

answered Nov 2, 2011 at 12:26

Darin Dimitrov

1.0m277 gold badges3.3k silver badges3k bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

MatteS Over a year ago

Doh! Thanks! I assumed that dataType: "json" was all that was needed. You know, assumptions is the mother of all...

Darin Dimitrov Over a year ago

@MatteS, dataType: 'json' indicates the response content type, not the request. Also if your server sends proper Content-Type response header to application/json you don't even need it as jQuery will automatically infer it. You can omit this parameter from your ajax request.

MatteS Over a year ago

Yes. This made me go back and recall why the dataType option was added to begin with in our code base, and it might be worth noting that it adds the header "Accept:application/json, text/javascript, /;" to the request, and thats something our error handling logic likes.

Collectives™ on Stack Overflow

ASP.NET MVC 3 Json Model Binding with 3 levels object

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related