C# - jquery ajax posted params not passing to server

Question

I have this simple ajax request on the client side:

var name = $("#txtNewsletterName");
var email = $("#txtNewsletterEmail");

$.ajax({
    url: "/Handlers/Handler.ashx",
    contentType: "application/json; charset=utf-8",
    type: "POST",
    dataType: "json",
    data: {
        op: "register_to_newsletter",
        name: name.val(),
        email: email.val()
    },
    async: true
});

and this code on the C# server side:

public void ProcessRequest(HttpContext context)
{
    context.Response.ContentType = "application/json";
    switch (context.Request["op"])
    {
        case "register_to_newsletter":
            string recipientName = context.Request["name"].Trim();
            string recipientEmail = context.Request["email"].Trim();
            break;
        default:
            break;
    }
}

The problem is that the data from the request is not passed to the server, so the context.Request["op"], context.Request["name"] and context.Request["email"] are null.

I've also checked context.Request.Form.AllKeys and it's string[0] So obviously the data does not get to the server.

When checking the Network tab in chrome debugger I see that there are 2 requests sent so I've added a screenshot of the Network data from chrome debugger:

Try enclosing your json object keys in quotations. Sometimes that makes the difference. So like this `"op": "register_to_newsletter",` — Pawan Nogariya, Jun 05 '16 at 09:15
You put images of Request headers, we need to see request body. Please post that — Pawan Nogariya, Jun 05 '16 at 09:23
@ElwinArens, I've added 2 screenshots of the request for you — Liran Friedman, Jun 05 '16 at 09:23
http://stackoverflow.com/questions/46582/response-redirect-with-post-instead-of-get — Elwin Arens, Jun 05 '16 at 09:24
I know but those images don't show Request body part they are just showing Request header part. — Pawan Nogariya, Jun 05 '16 at 09:24
@LiranFriedman Could you post another screenshot of the POST that actually shows the request data (this falls off the screen in the first one) — Elwin Arens, Jun 05 '16 at 09:48
@LiranFriedman And remove the contentType from the AJAX call — Elwin Arens, Jun 05 '16 at 09:50
@ElwinArens, I've posted another screenshot without the redirect and removed the content type from the ajax call — Liran Friedman, Jun 05 '16 at 09:57

Elwin Arens · Accepted Answer · 2016-06-06T06:49:51.907

2

There is a redirect occurring, which seems to be dropping the data.

If you look at the the second screenshot you see a GET HTTP 200, but the data is no longer in the request.

The redirect is from "/Handlers/Handler.ashx" to "/handlers/handler.ashx". Maybe there's an urlrewrite in the web.config that enforces lowercase urls and does a redirect if it matches an uppercase character?

What if you change the url to all lowercase:

url: "/handlers/handler.ashx",

And remove the contentType setting:

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

Because you're not deserializing the data on the server, but want to send it as the default contentType application/x-www-form-urlencoded; charset=UTF-8. The dataType is for the response, the contentType for the request.

edited Jun 06 '16 at 06:49

answered Jun 05 '16 at 09:17

Elwin Arens

1,542
10
21

Change Handler to lowercase. Might be it. – Elwin Arens Jun 05 '16 at 09:33
ie. change the whole url to lowercase. The redirect is from `"/Handlers/Handler.ashx"` to `"/handlers/handler.ashx"`. Maybe there's an urlrewrite in the web.config that enforces lowercase urls and does a redirect otherwise? – Elwin Arens Jun 05 '16 at 09:34
I changed it to lower case and the redirect is solved, but it didn't solve the issue of the params – Liran Friedman Jun 05 '16 at 09:39
Is context.Request.Form.AllKeys still empty? Try and access via context.Request.Form["op"] instead. – Elwin Arens Jun 05 '16 at 09:40
I've tried it as well, the `context.Request.Form.AllKeys` is empty and `context.Request.Form["op"]` is null – Liran Friedman Jun 05 '16 at 09:42
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/113838/discussion-between-elwin-arens-and-liran-friedman). – Elwin Arens Jun 05 '16 at 09:57

Giannis Grivas · Answer 2 · 2016-06-05T09:22:45.233

0

Try to change the data like:

  data: '{"op":"register_to_newsletter","name":"' + name.val() + '","email" :"' + email.val() + '"}'

And also use:

context.Request.Form["op"];

edited Jun 05 '16 at 09:22

answered Jun 05 '16 at 09:17

Giannis Grivas

3,374
1
18
38

score -1 · Answer 3 · answered Jun 05 '16 at 09:18

-1

why don't you start working with proper data models?

Instead of using HTTPContext, make your input parameter a model of the data that you want to receive. Then you won't have any issues.

answered Jun 05 '16 at 09:18

Andrei Dragotoniu

6,155
3
18
32

Care to give a sample ? – Liran Friedman Jun 05 '16 at 09:28

score -1 · Answer 4 · answered Jun 05 '16 at 09:25

Stringify your object before sending, like this

data: JSON.stringify({
        "op": "register_to_newsletter",
        "name": name.val(),
        "email": email.val()
    }),

So the full code should be like this

var name = $("#txtNewsletterName");
var email = $("#txtNewsletterEmail");

$.ajax({
    url: "/Handlers/Handler.ashx",
    contentType: "application/json; charset=utf-8",
    type: "POST",
    dataType: "json",
    data: JSON.stringify({
        "op": "register_to_newsletter",
        "name": name.val(),
        "email": email.val()
    }),
    async: true
});

C# - jquery ajax posted params not passing to server

4 Answers4