ASP .NET MVC - Ajax POST action fail

Question

I'm trying to do a simple action with some JavaScript code. I've got some items on a scheduler (DevExpress scheduler component). When I'm double clicking on an appointment (an item then), it should raise an JS function which is the case. My function should get the selected appointment id and pass it to Controller Action. Here is my JS code :

function DoubleClick() {
        debugger;
        var apt = GetSelectedAppointment(scheduler);
        var aptid = apt.appointmentId;
        $.ajax({
            type: "POST",
            url: "/Home/GetAppId",
            data: { id: aptid },
            dataType: 'json',
            success: function () {
                alert("ok");
            },
            error: function () {
                alert("error");
            }
        });
    }

And here is my C# code :

[HttpPost]
public JsonResult GetAppId(int id)
{
    context = new SchedulingDataClassesDataContext();

    DBAppointment app = (from a in context.DBAppointment where a.UniqueID == id select a).FirstOrDefault();
    return Json(new {rep = app});
}

As you can see in my JS code, I'm not doing anything special in case of success. However, I never reach the success part. Plus, when I'm looking at the Chrome dev tool (F12), I'm getting that red error message.

POST http://localhost:25206/Home/GetAppId 500 (Internal Server Error)

Anything that I'm doing wrong?

The error means your throwing an exception in the `GetAppId()` method. — , Mar 10 '15 at 09:58
When I'm debugging my C# code, it does not throw any exception. — Traffy, Mar 10 '15 at 10:00
@Traffy - after calling it hits getappid method during debugging ?? — Pranay Rana, Mar 10 '15 at 10:01
@Traffy not throwing any exceptions? do you get a value to return from this method? what is the return value? — Amr Elgarhy, Mar 10 '15 at 10:02
@Traffy - if you are getting error than it should hit error function of ajax request — Pranay Rana, Mar 10 '15 at 10:03
Yes, it hits my C# method which returns an DBAppointment object without throwing any exception. When I'm debugging in Chrome, it does not hit success nor fail... That's weird. — Traffy, Mar 10 '15 at 10:07
@Traffy Try to look at response text in your POST http://localhost:25206/Home/GetAppId 500 (Internal Server Error) — IVAAAN123, Mar 10 '15 at 10:10
@Traffy This is a suggestion, I'm not sure about exactly, But I got the same issue earlier, I added "[HttpPost, ValidateInput(false)]" anotation. try it and check — Harshana Narangoda, Mar 10 '15 at 10:11
@Traffy In Chrome press F12 to see dev console and look at Network page. Then click on request to see details (you need "Response" page) — IVAAAN123, Mar 10 '15 at 10:12
@IVAAAN123 here's what I'm getting : "A circular reference was detected while serializing an object of type ..." — Traffy, Mar 10 '15 at 10:20
Okay, it was a problem in my database model... Thanks all for your help ! — Traffy, Mar 10 '15 at 10:21

score 0 · Answer 1 · answered Mar 10 '15 at 10:12

0

Man, you need to force things as follows

 return Json(new {rep = app},"text/json",JsonRequestBehavior.AllowGet);

In addition, mind your navigation properties (if any) in order to avoid circular reference

answered Mar 10 '15 at 10:12

Bellash

7,560
6
53
86

score 0 · Answer 2 · edited May 23 '17 at 12:16

Please remove the name of the property in ajax data and edit that property as below.

function DoubleClick() {
    debugger;
    var apt = GetSelectedAppointment(scheduler);
    var aptid = apt.appointmentId;
    $.ajax({
        type: "POST",
        url: "/Home/GetAppId",
        data: aptid,
        dataType: 'json',
        success: function () {
            alert("ok");
        },
        error: function () {
            alert("error");
        }
    });
}

and edit your controller as follows

[HttpPost]
public JsonResult GetAppId([FromBody]int id)
{
    //...
}

Please read this blog post which is a good read and allowed me to understand what's going on.

http://encosia.com/using-jquery-to-post-frombody-parameters-to-web-api/

The original question that I asked

Simple post to Web Api

teo van kot · Answer 3 · 2015-03-10T10:30:18.117

According to your error your problem somewhere in select your data from DB or creating anonymous object when you try to serialize it to Json. I rewrite your select to simplify it and not creating any anonymous objects when return it from Controller like this:

[HttpPost]
public JsonResult GetAppId(int id)
{
    context = new SchedulingDataClassesDataContext();

    DBAppointment app = context.DBAppointment.FirstOrDefault(x => x.UniqueID == id);
    return Json(app);
}

Does it work like this?

score -1 · Answer 4 · answered Mar 10 '15 at 10:12

-1

Try changing the last line of the method to:

return Json(new { rep = app }, JsonRequestBehavior.AllowGet);

You need to tell C# to allow the json to be returned to the client.

answered Mar 10 '15 at 10:12

histr0n

29
2

1

The method is marked with `[HttpPost]` and the ajax call specifies `type: "POST",` so this is completely necessary – Mar 10 '15 at 10:13

ASP .NET MVC - Ajax POST action fail

4 Answers4