Question

I have 3 classes with below definition

  public class UserRole
    {
        public User User { get; set; }
        public IEnumerable<Role> Role { get; set; }
    }
public class Role
{
   public int Id{ get; set; }
   public string RoleName{ get; set; }
}
public class User
{
   public int Id{ get; set; }
   public string UserName{ get; set; }
}

This is the action method:

  // GET: /Admin/UserManagement/Create
        [HttpPost]
        [Transaction]
        public ActionResult Save(UserRole userrole)
        {
        }

Is there a way in Jquery to serialize some JavaScript vars into a class Obj and then send it to an MVC controller action via an AJAX post?

Answer 1

You could send a JSON request:

var data = {
    user: {
        id: 5,
        userName: 'john'
    },
    role : [
        { id: 1, roleName: 'role 1' },
        { id: 2, roleName: 'role 2' },
        { id: 3, roleName: 'role 3' }
    ]
};

$.ajax({
    url: '@Url.Action("Save")',
    type: 'POST',
    contentType: 'application/json',
    data: JSON.stringify(data),
    success: function(result) {
        alert('success');
    }
});

The JSON.stringify method is natively built into modern browsers but if you need to support legacy browsers you could include the json2.js script.