Multiple Json objects are not bound to asp.net mvc controller action on HttpPost

Question

I am passing to json objects to an asp.net mvc controller action. Both parameters are null.

Can someone spot the error prolly wrong naming?

/* Source Unit */
var sourceParent = sourceNode.getParent();
var sourceUnitParentId = sourceParent == null ? null : sourceParent.data.key;
var sourceUnit = { unitId: sourceNode.data.key, parentId: sourceUnitParentId };
var sourceUnitJson = JSON.stringify(sourceUnit);

/* Target Unit */
var targetParent = targetNode.getParent();
var targetUnitParentId = targetParent == null ? null : targetParent.data.key;
var targetUnit = { unitId: targetNode.data.key, parentId: targetUnitParentId };
var targetUnitJson = JSON.stringify(targetUnit);

moveUnit(sourceUnitJson, targetUnitJson);



function moveUnit(sourceUnit, targetUnit) {
        $.ajax({
            url: '@Url.Action("Move", "Unit")',
            type: 'POST',
            data: { sourceUnit: sourceUnit, targetUnit: targetUnit },
            success: function (response) {

            },
            error: function (e) {

            }
        });
    }

[HttpPost]
        public ActionResult Move(DragDropUnitViewModel sourceUnit, DragDropUnitViewModel targetUnit)
        {
            Unit sUnit = Mapper.Map<DragDropUnitViewModel, Unit>(sourceUnit);
            Unit tUnit = Mapper.Map<DragDropUnitViewModel, Unit>(targetUnit);
            _unitService.MoveUnit(sUnit, tUnit);
            return new EmptyResult();
        }

I see things labeled node and am assuming they're dom elements. Perhaps you're capturing that before the dom is ready? — MushinNoShin
– MushinNoShin, Commented Dec 1, 2012 at 21:37
@MushinNoShin The node stuff is from the jquery dynatree plugin. That plays no role here. Its just about passing multiple json objects to a mvc controller`s action. — Elisabeth
– Elisabeth, Commented Dec 1, 2012 at 21:41

Darin Dimitrov · Accepted Answer · 2012-12-01 22:00:05Z

Why don't you use a view model? If you want to pass JSON to a controller action then define a view model containing the 2 properties and then JSON.stringify the entire request.

Here's your view model:

public class MoveViewModel
{
    public DragDropUnitViewModel SourceUnit { get; set; }
    public DragDropUnitViewModel TargetUnit { get; set; }
}

Now your controller action will take the view model as argument:

[HttpPost]
public ActionResult Move(MoveViewModel model)
{
    Unit sUnit = Mapper.Map<DragDropUnitViewModel, Unit>(model.SourceUnit);
    Unit tUnit = Mapper.Map<DragDropUnitViewModel, Unit>(model.TargetUnit);
    _unitService.MoveUnit(sUnit, tUnit);
    return new EmptyResult();
}

and finally invoke this controller action using AJAX and send JSON request by making sure that you have specified the correct request content type, otherwise ASP.NET MVC wouldn't know how to deserialize back the JSON request:

/* Source Unit */
var sourceParent = sourceNode.getParent();
var sourceUnitParentId = sourceParent == null ? null : sourceParent.data.key;
var sourceUnit = { unitId: sourceNode.data.key, parentId: sourceUnitParentId };


/* Target Unit */
var targetParent = targetNode.getParent();
var targetUnitParentId = targetParent == null ? null : targetParent.data.key;
var targetUnit = { unitId: targetNode.data.key, parentId: targetUnitParentId };

/* build the view model */
var moveModel = { sourceUnit: sourceUnit, targetUnit: targetUnit };

/* Pass the view model to the server using an AJAX request */
moveUnit(moveModel);



function moveUnit(moveModel) {
    $.ajax({
        url: '@Url.Action("Move", "Unit")',
        type: 'POST',
        // It's very important to specify the correct content type
        // request header because we are sending a JSON request
        contentType: 'application/json; charset=utf-8',
        data: JSON.stringify(moveModel),
        success: function (response) {

        },
        error: function (e) {

        }
    });
}

Summary:

Every time you have a controller action taking more than 1 single argument you are doing it wrong. Stop and define a view model immediately.
Every time you have a controller action passing a domain model to a view you are doing it wrong. Stop and define a view model immediately.

As you can see it's all about view models in ASP.NET MVC.

Hey Darin, I used a "Wrapper" around my 2 DragDropUnitViewModel instances before. You would name the wrapper a viewmodel. I would agree. There was something that did not workout nicely but I guess that was my failure. Yeah of course I use always viewmodels in the meantime ;-) Thanks your code works.

Collectives™ on Stack Overflow

Multiple Json objects are not bound to asp.net mvc controller action on HttpPost

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related