ASP.NET MVC：从JavaScript传递到MVC控制器操作后，二维数组为null

Question

I have a 2d array of strings (12x5) that I want to pass from a javascript function to an asp.net mvc controller action. Using developer tools in IE I know that the array is populated with what I want it to be, so the issue is in or around the post function.

var dateArray = new Array();
//Populate Data

$.post("/Event/SetDateCalculationParameters", { dates: dateArray }, function () {
    //Stuff
});
}

And here is the MVC controller action

public ActionResult SetDateCalculationParameters(string[][] dates)
    {
        //Do stuff

        return Json(true);
    }

In the controller action, there are 12 items in the dates array, but they are all null. Ive been at this for a couple hours and am stumped. Is there an easier way to do this? Or am I missing something?

Answer 1

You could send them as a JSON request:

var dateArray = new Array();
dateArray[0] = [ 'foo', 'bar' ];
dateArray[1] = [ 'baz', 'bazinga' ];
// ... and so on

$.ajax({
    url: '@Url.Action("SetDateCalculationParameters", "Event")',
    type: 'POST',
    contentType: 'application/json',
    data: JSON.stringify({ dates: dateArray }),
    success: function (result) {

    }
});

The action signature must look like this:

[HttpPost]
public ActionResult SetDateCalculationParameters(string[][] dates)

Answer 2

To solve the same problem I have created JsonModelBinder and JsonModelAttribute that should be applied to the parameter:

public class JsonModelBinder : IModelBinder
    {
        private readonly static JavaScriptSerializer _serializer = new JavaScriptSerializer();

    public object BindModel(ControllerContext controllerContext, ModelBindingContext bindingContext)
    {
        var stringified = controllerContext.HttpContext.Request[bindingContext.ModelName];

       if (string.IsNullOrEmpty(stringified))
            return null;

        return _serializer.Deserialize(stringified, bindingContext.ModelType);
    }
}

public class FromJsonAttribute : CustomModelBinderAttribute
{
    public override IModelBinder GetBinder()
    {
        return new JsonModelBinder();
    }
}

Your controller will look as follow:

public ActionResult SetDateCalculationParameters([FromJson]string[][] dates)

Also you should stringify your array:

$.post("/Event/SetDateCalculationParameters", { dates: JSON.stringify(dateArray)}, function () {             //Stuff         });         }

It works for me.