Passed Json is not accepted by controller

Question

I get this result from creating JSON in my view

header:{"ScheduledVisit":"08/02/2017 12:00 AM","Company":"fdsa","ContactPerson":"asfd","Phone":"asdf","Purpose":"fasd","Detail":"asdf"}

My model looks like this:

public class ScheduleVisit
{
    [Required(ErrorMessage = "* Required")]
    public DateTime ScheduledVisit { get; set; }
    public string Company { get; set; }
    public string ContactPerson { get; set; }
    public string Phone { get; set; }
    public string Purpose { get; set; }
    public string Detail { get; set; }
}

I pass my data like so:

document.getElementById("btn_submit_schedule").addEventListener("click", function (event) {
        event.preventDefault();
        if ($("#scheduledVisit").val().length === 0) {
            $("#scheduledVisit").focus();
        }

        var obj = {};
        obj.ScheduledVisit = document.getElementById("scheduledVisit").value;
        obj.Company = document.getElementById("company").value;
        obj.ContactPerson = document.getElementById("contactPerson").value;
        obj.Phone = document.getElementById("phone").value;
        obj.Purpose = document.getElementById("purpose").value;
        obj.Detail = document.getElementById("detail").value;
        console.log(obj);
        addSchedule(obj);
    });

    function addSchedule(data) {
        $.ajax({
            type: "POST",
            url: "@Url.Action("ScheduleVisit", "ScheduleVisit")",
            data: {header: JSON.stringify(data)},
        success: function(result) {
            alert(result);
        },
        error: function(error) {
            alert(error);
        }
    });
}

and my controller looks like this:

    [HttpPost]
    public JsonResult ScheduleVisit(ScheduleVisit header)
    {

        return Json(false);
    }

When I run in debug mode and check if my controller accepts anything, I get null on the "header" parameter. Please show me where I am getting it wrong.

C# and javascript. The Json(false) is just to ouput something. — Ibanez1408, Aug 11 '17 at 04:52

score 1 · Accepted Answer · answered Aug 11 '17 at 05:53

1

Just replaced data: {header: JSON.stringify(data)} with data: data with current solution.

This very complex and manual way you'll can use simple way as following

Assign name field to every element as same like id now

<input type="text" name="Company" value="" />

Use serializeArray

data: $("form").serializeArray(),

Hope this will help.

answered Aug 11 '17 at 05:53

Govind Samrow

9,981
13
53
90

Thank you. No doubt, this is a better way. – Ibanez1408 Sep 07 '17 at 10:54

score 0 · Answer 2 · answered Aug 11 '17 at 05:34

0

The problem is that "data: {header: JSON.stringify(data)}" is not the same object as you expect on the controller.

This should work.

        $.ajax({
           type: "POST",
           url: "@Url.Action("ScheduleVisit", "ScheduleVisit")",
           data: data,
           ...

The controller expects an object like:

{
    "ScheduledVisit":"08/02/2017 12:00 AM",
    "Company":"fdsa",
    "ContactPerson":"asfd",
    "Phone":"asdf",
    "Purpose":"fasd",
    "Detail":"asdf"
}

answered Aug 11 '17 at 05:34

Mueui

181
8

I see... I'll do that as soon as I get in front of my PC. I hope your solution works! – Ibanez1408 Aug 11 '17 at 05:35
Here's another question though, if I remove the header, how will I be able to pass two parameters. Actually I do have to pass 2 parameters. In the code I'm just saying one. – Ibanez1408 Aug 11 '17 at 05:38
As much as I know you can't send multiple objects to an HttpPost. You can create an object containing both of your objects you want to send and using that. https://stackoverflow.com/questions/35430045/post-multiple-objects-to-web-api – Mueui Aug 11 '17 at 05:50

Passed Json is not accepted by controller

2 Answers2