none
data is null when ajax call reaches controller RRS feed

  • Question

  • Hello,

    I'm trying to do an ajax call to my MVC controller but the data is coming through null.

    Here is my ajax call:

    var projectId = store.get('filterProjectId');
                var data = ra.reportConfigPage.ReportJsonParsed;
                var equipmentType = $("#EquipmentTypeTextbox").val();
                var dataWithToken = ra.AddVerificationTokenToData({
                    projectID: projectId,
                    data: data,
                    equipmentType: equipmentType
                });
    
                $.post({
                    url: "ReportConfig/SubmitData",
                    data: dataWithToken,
                    traditional: true
                })
                    .done(function (data)
                    {
    ...
                    })
                    .fail(function (jqXhr, textStatus, errorThrown)
                    {
    ...
                    });



    And here's SubmitData(...):

    [ValidateAntiForgeryToken]
    [HttpPost]
    [ValidateInput(false)]
    public JsonResult SubmitData(int projectId, Top3AndReportCard data = null, string equipmentType = null)
    {
    ...
    }



    data is not null in the Javascript. When it gets to SubmitData(...) however, it is null.

    Can anyone see what's wrong? Thanks.
    • Moved by CoolDadTx Tuesday, July 25, 2017 1:50 PM ASP.NET related
    Monday, July 24, 2017 10:34 PM

All replies

  • Hard to spot by just eyeballing it but I would change projectID to projectId to start with.  Let me know if it is all fields or just the one.

    Cheers, Jeff

    Monday, July 24, 2017 11:16 PM
  • Hello Gibran Shah,

    You should create a class to receive data from ajax automatically instead of field.The following is a example.

    $.ajax({
                type: 'POST',
                url: "/Home/SubmitData",
    
                data: {
                    id: 5,
                    name:"Name"  
                },
                success: function (data) {
                    alert(data.message);
                }
            });
    

    The Controller:

    public class jsonObj  {
            public int id { get; set; }
            public string name { get; set; }
                    }
            [ValidateAntiForgeryToken]
            [HttpPost]
            [ValidateInput(false)]
            public JsonResult SubmitData(jsonObj obj)
            {
                return null;
            }
    

    The result:

    Best regards,

    feih-7


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.

    Tuesday, July 25, 2017 6:28 AM
  • Please post questions related to MVC in the ASP.NET forums.
    Tuesday, July 25, 2017 1:50 PM
  • Hello Gibran Shah,

    You should create a class to receive data from ajax automatically instead of field.The following is a example.

    $.ajax({
                type: 'POST',
                url: "/Home/SubmitData",
    
                data: {
                    id: 5,
                    name:"Name"  
                },
                success: function (data) {
                    alert(data.message);
                }
            });

    The Controller:

    public class jsonObj  {
            public int id { get; set; }
            public string name { get; set; }
                    }
            [ValidateAntiForgeryToken]
            [HttpPost]
            [ValidateInput(false)]
            public JsonResult SubmitData(jsonObj obj)
            {
                return null;
            }

    The result:

    Best regards,

    feih-7


    MSDN Community Support
    Please remember to click "Mark as Answer" the responses that resolved your issue, and to click "Unmark as Answer" if not. This can be beneficial to other community members reading this thread. If you have any compliments or complaints to MSDN Support, feel free to contact MSDNFSF@microsoft.com.

    Top3AndReportCard is already a class that matches the data being passed.

    But just to go with your example, I created a simple class as follows:

    public class DummyClass { public string field1 { get; set; } public int field2 { get; set; } }; //[ValidateAntiForgeryToken] [HttpPost] //[ValidateInput(false)] public JsonResult SubmitData(int projectId, DummyClass data = null, string equipmentType = null)

    {

    ...

    }

    And the javascript:

                var projectId = store.get('filterProjectId');
                var equipmentType = $("#EquipmentTypeTextbox").val();
                var dummyClass = {field1: "abc", field2: 3};
    
                $.post({
                    url: "ReportConfig/SubmitData",
                    data: {projectId: projectId, data: dummyClass, equipmentType: equipmentType},
                    traditional: true
                }).done(function (data) {
    ...
    });
    data still comes through null.

    Tuesday, July 25, 2017 2:23 PM
  • UPDATE:

    I managed to get it working with this code:

    public class DummyClass
            {
                public int projectId { get; set; }
                public string equipmentType { get; set; }
            };
    
            [ValidateAntiForgeryToken]
            [HttpPost]
            [ValidateInput(false)]
            public JsonResult SubmitData(DummyClass data = null)
    {
    ...
    }

    Javascript:

    var projectId = store.get('filterProjectId');
                var equipmentType = $("#EquipmentTypeTextbox").val();
    
                var dummyClass = {
                    projectId: projectId,
                    equipmentType: equipmentType
                };
                dummyClass = ra.AddVerificationTokenToData(dummyClass);
    
                $.post({
                    url: "ReportConfig/SubmitData",
                    data: dummyClass,
                    traditional: true
                }).done(function (data)
                    {
    });

    In other words, it appears that I can only have one argument in the controller method, and that argument must be the object passed to it from the ajax class. The project ID and the equipment type must be embedded in the object.

    This is all well and good until I try to add my actual object:

            public class DummyClass
            {
                public int projectId { get; set; }
                public Top3AndReportCard data { get; set; }
                public string equipmentType { get; set; }
            };

    DummyClass ends up being null. I tried creating a very simple class to replace Top3AndReportCard:

            public class DummyClass2
            {
                public int field1 { get; set; }
            };
    
            public class DummyClass
            {
                public int projectId { get; set; }
                public DummyClass2 data { get; set; }
                public string equipmentType { get; set; }
            };

    And that causes DummyClass to be null as well.

    So it seems like the issue arises when I have objects nested within objects (and Top3AndReportCard have several layers of nested objects).

    Tuesday, July 25, 2017 3:26 PM