jQuery injecting data in ajax global event

I'm trying to inject data in my ajax requests, but it fails and I don't know why. I tried to look at the jQuery source code, but still can't find why it doesn't work, Any help appreciated. Here is the code :

$('#someElement').ajaxSend(function(e, req, options) {
    options.data += (options.data.length > 0 ? '&' : '') + '__token=' + $('input#requestToken').val();
}).ajaxSuccess(function(e, req, options, data) {
    if (data.nextToken) {
        $('input#requestToken').val(data.nextToken);
        delete data.nextToken;
    }
});

The response looks like this :

{
   "response":
   {
      "code":0,
      // ...
   },
   "nextToken":"4ded26352b3d44"
}

A typical request would be, for example :

$.getJSON(url, {something:'value'}, function(data) {
   if (data.response.code != 0) {
      // handle code
   }
});

The problem is that, the data sent is "something=value"; the modified data is not sent.

** EDIT **

The current request data is

something: value

and should be

something: value
__token: 4ded288eec1f56

In the ajaxSend event callback, if I print the value of options.data after modifying it, the value is "something=value&__token=4ded288eec1f56", but "__token=4ded288eec1f56" is not sent. Why isn't it sent in the request?

But more specifically, how to "fix" this, if even pos开发者_运维问答sible?

I think the problem is that by the time jQuery decides to call the "ajaxSend" callback, the parameters have already been used to prepare the request. Thus, changing them in that handler has no effect.

edit — given the answer from @mikermcneil I'm not sure this is right. The jQuery "ajax" method is, to say the least, complicated. His sample page certainly seems to work, which confuses me but probably should just help me realize how little I know about jQuery internals :-)

-edit

Update-- the trouble is with getJSON.

It looks like, while jQuery does fire the ajaxSend event in both cases, it doesn't actually use the changed data variable with getJSON like it does with post.

Replace getJSON with $.post to solve your problem (that's what I'm doing in the example I linked to below).

-edit- Well, I set up a version of it here:

http://abolition.me/toys/View/attachAjax.html (see the console)

I'm having the server send back whatever it got and it's saying: __token: "toketoketoke" key: "val1" key2: "val2"

So it looks like modifying the request data is working-- what does your handler look like server-side?

I'm looking into it-- first and foremost though (and I mistake I made as I tried to replicate the problem), have you checked that you're assigning your event after the document is ready? ($(function(){ });)

I am not sure that your JSON response is correct:

{
  "response":
  {
  "code":0,  <-- this is not valid
  },
  "nextToken":"4ded26352b3d44"
}

valid should be:

{
  "response":
  {
  "code":0
  },
  "nextToken":"4ded26352b3d44"
}

To validate your JSON response you can use:

The JSON Validator

You are only passing data within the second parameter in your getJSON call {something:'value'}. Any data you want to send to the server must be included there. Thus, the __token must be included in that parameter.

The third parameter in the getJSON call is the call back function. The parameter passed to that function is the response from the server.

$.getJSON(
    url,
    {
        something:'value',
        __token: 'token value'
    ,
    function(response) {
        if (response.response.code != 0) {
        // handle code
        }
    }
);