Question

I am trying to pass the fullcalendar events to my controller via Json, however I am getting null passed through to my controller?
what am I doing wrong?
Here is my view code:

<script type='text/javascript'>
    $(document).ready(function () {
        $(function () {
            $("#save").click(function () {
                var eventsFromCalendar = $('#calendar').fullCalendar('clientEvents');
                alert(eventsFromCalendar);
                $.ajax(
            {

                url: '@Url.Action("Save")',
                type: 'POST',
                traditional: true,
                data: eventsFromCalendar,
                dataType: "json",
                success: function (response) {
                    alert(response);
                },
                error: function (xhr) {
                    debugger;
                    alert(xhr);
                }
            });
            });
        });
    });
     </script> 

And my controller:

[HttpPost]
public JsonResult Save(object[] data)
{
    // edit the item and get it back
    return Json("success");
}

When I break into the Jscript and look at eventsFromCalendar it is populated fine.

Answer 1

Try converting your events to JSON text:

data:{ eventsJson: JSON.stringify(eventsFromCalendar) }

(see JSON.stringify Function (JavaScript))

Then use a tool like Json.NET to parse the posted JSON string in your controller action:

[HttpPost]
public ActionResult Save(string eventsJson)
{
    var events = JsonConvert.DeserializeObject<IEnumerable<Event>>(eventsJson);
    return View();
}

public class Event
{
    public int Id { get; set; }
    public string Title { get; set; }
    public DateTime Start { get; set; }
    public DateTime End { get; set; }
}