null keeps being passed from view to controller

Question

I have tried all of the solutions I could already find on stackoverlfow as well as starting again following instructions found here https://stick2basic.wordpress.com/2013/04/14/how-to-pass-model-from-view-to-controller-using-jquery/

Every time I trigger my ajax call it passes null to the controller

*Fixed spelling mistake, issue still occurs

Model

public class DateModel
    {
        public DateTime date { get; set; }
    }

JavaScript

$(document).ready(function () {
    $("#jqxdatetimeinput").jqxDateTimeInput({ width: '250px', height: '25px' });
    $("#jqxbutton").jqxButton({ width: '150', height: '25' });

    $("#jqxbutton").on('click', function () {

        var dateSelected = $('#jqxdatetimeinput').jqxDateTimeInput('getDate');
        alert(dateSelected);

        var DateModel =
            {
                "date": dateSelected
            };

        $.ajax({
            url: 'home/submitDate/',
            data: JSON.stringify(DateModel),
            type: 'POST',
            contentType: 'application/json; charset=utf-8',
            success: function (data) {
                alert(data);
            }
        });
    });
});

Controller

public class HomeController : Controller
    {
        public IActionResult Index()
        {
            DateModel selectionDate = new DateModel();
            return View();
        }

        public JsonResult submitDate(DateModel selectionDate)
        {
            return Json(selectionDate.date);
        }
    }

Possible duplicate of [MVC ajax post to controller action method](http://stackoverflow.com/questions/19663762/mvc-ajax-post-to-controller-action-method) — David L, Sep 20 '16 at 22:34
No, I am trying to pass a composite and not param's, I am trying to do the opposite of the post you suggest. I need to receive a model and not params directly, this is a simplified example of my issue, my model is considerably larger in production. — Terry, Sep 21 '16 at 13:13

Shyju · Answer 1 · 2016-09-20T21:44:38.803

You do not need to use JSON.stringify. Since it is a simple object, you can pass it as it is. Model binding will work.

$.ajax({
            url: 'home/submitDate/',
            data: DateModel,
            type: 'POST',                
            success: function (data) {
                alert(data);
            }
        });

Or If you want to send the Json strinfified version of your js object, you need to tell the server what type of data you are sending by specifying the contentType property value. You have it wrong! Fix your typo in contentType! value

$.ajax({
    url: '@Url.Action("submitDate")',
    data: JSON.stringify(DateModel),
    type: 'POST',
    contentType: 'application/json; charset=utf-8',
    success: function (data) {
        alert(data);
    }
});

Thank you for your suggestions but both failed to resolve the issue. Fixing my spelling mistake as well as switching to the code you suggested both still send NULL — Terry, Sep 21 '16 at 13:11

score 0 · Answer 2 · answered Sep 20 '16 at 21:36

0

Is it the typo on your contentType parameter?

contentType: 'aplication/json; charset=utf-8',

should perhaps be

contentType: 'application/json; charset=utf-8',

answered Sep 20 '16 at 21:36

Rich S

418
3
8

Thank you for your suggestion, the spelling mistake did not resolve the issue though, I still receive null. – Terry Sep 21 '16 at 13:11

score 0 · Accepted Answer · answered Sep 21 '16 at 13:47

0

The issue was the date format. I was able to use IE Debugging and see that JQ Widgets passes the date in an unexpected way that DateTime couldn't handle.

answered Sep 21 '16 at 13:47

Terry

1,621
4
25
45

null keeps being passed from view to controller

3 Answers3