CODEWITHSUNDEEP
jsonasp.net-mvc-4
forwheeler
forwheeler

Reputation: 843

JSON posted to MVC Controller is null

Here is my jQuery which looks at an HTML table and gets an id from the tr and an input field value and puts them in an object to be json stringified and posted to an MVC controller. I am using jQuery 1.8.2

      var rowdata = [];
            $('table').find('tr').each(function () {
                myjson = [];
                item = {}
                item["id"] = $(this).attr('id');
                item["reason"] = $(this).find('input').val();
                myjson.push(item);
                rowdata.push(myjson);
            });
            jsonstring = JSON.stringify(rowdata);
            $.ajax({
                url: '@Url.Action("AbsentReason", "Attendance")',
                data: jsonstring,
                type: 'POST',
                traditional: true,
                contentType: 'json',
                success: function (data) {
                    $('#message').html("Reason was updated");
                }
            });

This is the resulting JSON which checks valid.

[[{}],[{"id":"6","reason":""}],[{"id":"7","reason":""}],[{"id":"15","reason":""}],[{"id":"23","reason":""}],[{"id":"29","reason":""}],[{"id":"30","reason":""}],[{"id":"31","reason":""}],[{"id":"35","reason":""}],[{"id":"40","reason":""}],[{"id":"41","reason":""}],[{"id":"42","reason":""}],[{"id":"48","reason":""}],[{"id":"49","reason":""}],[{"id":"50","reason":""}],[{"id":"51","reason":""}],[{"id":"52","reason":""}],[{"id":"53","reason":""}],[{"id":"54","reason":""}],[{"id":"55","reason":""}],[{"id":"56","reason":""}],[{"id":"57","reason":""}],[{"id":"58","reason":""}],[{"id":"59","reason":""}],[{"id":"60","reason":""}],[{"id":"61","reason":""}],[{"id":"62","reason":""}],[{"id":"63","reason":""}],[{"id":"74","reason":""}],[{"id":"75","reason":""}],[{"id":"80","reason":""}],[{"id":"81","reason":""}],[{"id":"87","reason":""}],[{"id":"88","reason":""}],[{"id":"90","reason":""}],[{"id":"91","reason":""}],[{"id":"105","reason":""}],[{"id":"106","reason":""}],[{"id":"107","reason":""}],[{"id":"108","reason":""}],[{"id":"110","reason":""}],[{"id":"111","reason":""}],[{"id":"119","reason":""}]]:

This is the start of my controller.

 [HttpPost]
    public ActionResult AbsentReason(string jsonstring)
    {            
        return View("Index");
    }

The jsonstring parameter is always null. Can anyone see what is wrong?

UPDATE

This is my new controller based on the comments to use a model and allow MVC to do the work for me.

 [HttpPost]
    public ActionResult AbsentReason(IEnumerable<VMAttendance> jsonstring)
    {            
        return View("Index");
    }

and my viewmodel

public class VMAttendance
{
    public int PersonID
    {
        get;
        set;
    }
    public string Reason
    {
        get;
        set;
    }
}

The parameter is still null. I also update my jQuery in an attempt to send the correct json.

   var data = $('table').find('tr').map(function () {
                var id = $(this).attr('id');
                var reason = $(this).find('input').val();

                var rowdata = { "PersonID": id, "Reason": reason };
                return rowdata;
            }).get();


            $.ajax({
                url: '@Url.Action("AbsentReason", "Attendance")',
                data: data,
                type: 'POST',
                traditional: true,
                contentType: 'json',
                success: function (data) {
                    $('#message').html("Reason was updated");
                }
            });

I tried to send some test json to the controller but the parameter is still null.

var data = '{"PersonID":"6","Reason":""},{"PersonID":"7","Reason":""}'

Upvotes: 1

Views: 6840

Answers (3)

forwheeler
forwheeler

Reputation: 843

I got this working by changing the contentType from 'json' to 'application/json; charset=utf-8' and removing the first empty object in my json which was created from an extra tr in the table for the header. The json looked like 

[{},{"PersonID":"6","Reason":""},{"PersonID":"7","Reason":""}]

when it should look like this

[{"PersonID":"6","Reason":""},{"PersonID":"7","Reason":""}]

My controller looks like this and works nice.

  [HttpPost]
    public ActionResult AbsentReason(IEnumerable<VMAttendance> jsonstring)
    {            
        return View("Index");
    }

Thanks Duy for your assistance!

Upvotes: 3

Van
Van

Reputation: 1387

assuming you have an MVC model as follow

public class MyModel
{
   public int ID {get;set;}
   public string Reason {get;set;}
}

if you modify your action method signature to

public ActionResult AbsentReason(IEnumerable<MyModel> json)

when you post back your json object, the json serializer will deserialize your json into an IEnumerable of MyModel.

Upvotes: 3

Van
Van

Reputation: 1387

change the contentType in your ajax object to string.

i'm curious as to why you would want to treat your json as string and not as object. Normally I would have a C# viewmodel and let the serializer map the json object to that C# view model in my controller

Upvotes: 1

Related Questions