MVC3 jquery ajax parameter data is null at controller

asp.net-mvc-3, jquery, kendo-ui

Solution

Did you try specifying the dataType and contentType in you ajax post ?

$.ajax({
             type: "POST",
             url: '@Url.Action("ToggleRole", "Administration")',
             data: JSON.stringify(dataItem),
             dataType: "json",
             contentType: "application/json; charset=utf-8",
             success: function () {
                 RefreshGrid();
             },
             error: function () {
                 RefreshGrid()
             }
         });

Problem

I have a controller action that I want to update via a jquery call. The action runs, but there is no data in the parameters. I am using a kedoui grid with a custom command in a column that I want to run some server code. ``` kendoui grid in view ... columns.Command(command => { command.Custom("ToggleRole").Click("toggleRole"); }); ... ``` The model is of type List<_AdministrationUsers>. ``` public class _AdministrationUsers { [Key] [ScaffoldColumn(false)] public Guid UserID { get; set; } public string UserName { get; set; } public string Role { get; set; } } ``` Here is my toggleRole Script: ``` <script type="text/javascript"> function toggleRole(e) { e.preventDefault(); var dataItem = this.dataItem($(e.currentTarget).closest("tr")); alert(JSON.stringify(dataItem)); $.ajax({ type: "POST", url: '@Url.Action("ToggleRole", "Administration")', data: JSON.stringify(dataItem), success: function () { RefreshGrid(); }, error: function () { RefreshGrid() } }); } </script> ``` Here is my controller action: ``` [HttpPost] public ActionResult ToggleRole(string UserID, string UserName, string Role) { ... } ``` The controller action fires, but there is no data in any of the parameters. I put the alert in the javascript to verify that there is indeed data in the "dataItem" variable. Here is what the alert text looks like: ``` {"UserID":"f9f1d175...(etc.)","UserName":"User1","Role","Admin"} ```

Original source